:root {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  color: #17251f;
  background: #f2f5f3;
  font-synthesis: none;
  --green: #16a374;
  --green-dark: #0f6f53;
  --ink: #17251f;
  --muted: #75827c;
  --line: #e4e9e6;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: #f2f5f3; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { border: 0; cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid rgba(22,163,116,.45); outline-offset: 2px; }

.admin-shell { min-height: 100vh; display: flex; }
.sidebar { position: fixed; z-index: 30; inset: 0 auto 0 0; width: 238px; display: flex; flex-direction: column; padding: 26px 18px 20px; color: #eaf4f0; background: linear-gradient(180deg,#153d32,#0d3027); }
.admin-brand { display: flex; align-items: center; gap: 11px; padding: 0 9px; }
.admin-brand > i, .login-brand i, .login-mobile-brand i { width: 38px; height: 38px; display: grid; place-items: center; color: white; background: var(--green); border-radius: 12px; font-size: 22px; font-style: normal; font-weight: 700; box-shadow: 0 10px 24px rgba(9,116,80,.28); }
.admin-brand > span { display: flex; flex-direction: column; gap: 3px; }.admin-brand b { font-size: 13px; letter-spacing: .18em; }.admin-brand small { color: #7eaa9b; font-size: 7px; letter-spacing: .18em; }
.sidebar nav { display: flex; flex-direction: column; gap: 6px; margin-top: 42px; }
.nav-item { display: flex; align-items: center; gap: 12px; min-height: 47px; padding: 0 13px; color: #93b2a7; border-radius: 13px; font-size: 12px; transition: .18s; }
.nav-item i { width: 25px; height: 25px; display: grid; place-items: center; color: #7ca496; background: rgba(255,255,255,.05); border-radius: 8px; font-size: 12px; font-style: normal; font-weight: 700; }
.nav-item:hover { color: white; background: rgba(255,255,255,.05); }.nav-item.active { color: white; background: rgba(35,191,138,.16); }.nav-item.active i { color: white; background: var(--green); }
.sidebar-note { margin-top: auto; padding: 14px; color: #86a99c; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.06); border-radius: 14px; }.sidebar-note span { color: #a8c7bc; font-size: 9px; font-weight: 700; }.sidebar-note p { margin: 7px 0 0; font-size: 8px; line-height: 1.65; }
.workspace { width: calc(100% - 238px); min-height: 100vh; margin-left: 238px; }
.admin-header { height: 86px; display: flex; align-items: center; justify-content: space-between; padding: 0 35px; background: rgba(255,255,255,.86); border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); }
.admin-header > div:first-of-type > span { color: #8a9691; font-size: 8px; letter-spacing: .1em; }.admin-header h1 { margin: 3px 0 0; font-size: 19px; letter-spacing: -.02em; }
.admin-profile { display: flex; align-items: center; gap: 10px; }.admin-profile > i { width: 36px; height: 36px; display: grid; place-items: center; color: #176f54; background: #e5f4ee; border-radius: 12px; font-size: 11px; font-style: normal; font-weight: 700; }.admin-profile > span { display: flex; flex-direction: column; gap: 3px; }.admin-profile b { font-size: 10px; }.admin-profile small { color: #8a9691; font-size: 8px; }.admin-profile form { margin-left: 8px; }.admin-profile button { padding: 7px 10px; color: #6d7a75; background: #f0f3f2; border-radius: 9px; font-size: 9px; }
.mobile-menu { display: none; width: 38px; height: 38px; color: #44564f; background: #edf2f0; border-radius: 11px; }
.content { max-width: 1500px; margin: 0 auto; padding: 28px 34px 50px; }
.flash { padding: 12px 14px; margin-bottom: 16px; border-radius: 12px; font-size: 10px; }.flash.success { color: #176e53; background: #e7f6f0; border: 1px solid #ceeade; }.flash.error { color: #a4413b; background: #fff0ef; border: 1px solid #f3d4d1; }

.metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.metric-card { min-height: 134px; display: flex; align-items: flex-start; gap: 14px; padding: 21px; background: white; border: 1px solid #e6ebe8; border-radius: 19px; box-shadow: 0 8px 28px rgba(28,62,50,.045); }.metric-icon { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; font-size: 15px; font-style: normal; font-weight: 700; }.metric-icon.green { color: #13845f; background: #e5f5ef; }.metric-icon.navy { color: white; background: #173f34; }.metric-icon.amber { color: #a66f17; background: #fff2d9; }.metric-icon.blue { color: #456eb4; background: #e9f0ff; }.metric-card div { display: flex; flex-direction: column; }.metric-card small { color: #83908a; font-size: 9px; }.metric-card strong { margin-top: 7px; font-size: clamp(19px,2vw,26px); letter-spacing: -.03em; }.metric-card p { margin: 7px 0 0; color: #98a29e; font-size: 8px; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(280px,.85fr); gap: 17px; margin-top: 17px; }
.panel { overflow: hidden; background: white; border: 1px solid #e5eae7; border-radius: 20px; box-shadow: 0 8px 28px rgba(28,62,50,.04); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; min-height: 83px; padding: 19px 22px; border-bottom: 1px solid #edf0ee; }.panel-heading > div > span { color: #16946b; font-size: 7px; font-weight: 700; letter-spacing: .16em; }.panel-heading h2 { margin: 4px 0 0; font-size: 15px; }.panel-heading p { margin: 5px 0 0; color: #8a9691; font-size: 8.5px; }.panel-heading > a { color: #188a66; font-size: 9px; }
.table-wrap { overflow-x: auto; }.table-wrap table { width: 100%; border-collapse: collapse; white-space: nowrap; }.table-wrap th { height: 42px; padding: 0 15px; color: #8d9893; background: #fafbfa; text-align: left; font-size: 8px; font-weight: 600; letter-spacing: .03em; }.table-wrap td { height: 63px; padding: 8px 15px; border-top: 1px solid #eff2f0; font-size: 9.5px; }.table-wrap tbody tr:hover { background: #fbfdfc; }.table-wrap td > small { color: #8b9692; font-size: 8px; }.table-wrap code { color: #456059; font-family: Consolas,monospace; font-size: 8.5px; }
.user-cell { display: flex; align-items: center; gap: 9px; }.user-cell > i { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; color: #176c53; background: #e6f3ee; border-radius: 11px; font-style: normal; font-size: 10px; font-weight: 700; }.user-cell > span { display: flex; flex-direction: column; gap: 3px; }.user-cell b { font-size: 9.5px; }.user-cell small { color: #8c9792; font-size: 7.5px; }.user-cell.compact > i { width: 30px; height: 30px; border-radius: 10px; }
.network-tag { display: inline-flex; padding: 4px 7px; color: #476059; background: #eff3f1; border-radius: 7px; font-size: 7.5px; font-weight: 600; }.status { display: inline-flex; padding: 5px 8px; border-radius: 999px; font-size: 7.5px; font-weight: 600; }.status.success { color: #137754; background: #e4f5ed; }.status.warning { color: #986719; background: #fff2d9; }.status.danger { color: #ad4841; background: #ffebe9; }.status.muted { color: #707e78; background: #edf1ef; }
.muted-text { color: #8d9893; font-size: 8px !important; }.block-text { display: block; margin-top: 4px; color: #8b9792; font-size: 7.5px; }.positive { color: #11865f !important; }.direction { font-size: 8px; font-weight: 600; }.direction.in { color: #12815c; }.direction.out { color: #9b5b34; }
.activity-list { padding: 3px 20px 14px; }.activity-item { display: flex; align-items: center; gap: 10px; min-height: 62px; border-bottom: 1px solid #edf1ef; }.activity-item:last-child { border-bottom: 0; }.activity-item > i { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; color: #905f2c; background: #fff1e1; border-radius: 11px; font-style: normal; }.activity-item > i.incoming { color: #147957; background: #e5f5ee; }.activity-item > span { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 4px; }.activity-item b { overflow: hidden; font-size: 8.5px; white-space: nowrap; text-overflow: ellipsis; }.activity-item small { color: #929d98; font-size: 7px; }.activity-item strong { font-size: 9px; }

.filters-form { display: flex; gap: 7px; }.filters-form input, .filters-form select, .review-actions input { height: 36px; min-width: 130px; padding: 0 10px; color: #334840; background: #f7f9f8; border: 1px solid #dfe6e2; border-radius: 10px; outline: 0; font-size: 8.5px; }.filters-form input { min-width: 210px; }.filters-form button { padding: 0 13px; color: white; background: #183f34; border-radius: 10px; font-size: 8.5px; }
.table-action { padding: 6px 9px; color: #176f54; background: #e8f5f0; border-radius: 8px; font-size: 8px; }.table-action.danger { color: #a94842; background: #ffedeb; }
.empty-state { padding: 45px 20px !important; color: #929d98; text-align: center !important; font-size: 9px; }
.review-banner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; margin-bottom: 16px; color: #7f5c21; background: #fff8e8; border: 1px solid #f0e2c4; border-radius: 17px; }.review-banner > div { display: flex; align-items: center; gap: 11px; }.review-banner i { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; color: #a16e18; background: #ffedc6; border-radius: 11px; font-style: normal; font-weight: 700; }.review-banner span b { font-size: 10px; }.review-banner p { margin: 4px 0 0; color: #a17f49; font-size: 8px; }.review-banner > strong { padding: 6px 9px; background: rgba(255,255,255,.65); border-radius: 9px; font-size: 8.5px; }
.withdrawal-list { display: grid; gap: 12px; padding: 17px; background: #f8faf9; }.withdrawal-card { padding: 16px; background: white; border: 1px solid #e4eae7; border-radius: 16px; }.withdrawal-primary { display: flex; align-items: center; justify-content: space-between; padding-bottom: 13px; border-bottom: 1px solid #edf1ef; }.withdrawal-details { display: grid; grid-template-columns: 1fr 1fr 1.4fr 1fr; gap: 20px; padding: 15px 0; }.withdrawal-details > div { display: flex; min-width: 0; flex-direction: column; gap: 6px; }.withdrawal-details span { color: #8b9792; font-size: 7.5px; }.withdrawal-details b, .withdrawal-details code { overflow: hidden; color: #33463f; font-size: 8.5px; white-space: nowrap; text-overflow: ellipsis; }.withdrawal-details strong { font-size: 14px; }.withdrawal-details strong small { font-size: 8px; }.review-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 13px; border-top: 1px solid #edf1ef; }.review-actions form { display: flex; gap: 7px; }.review-actions input { flex: 1; min-width: 0; }.review-actions button { padding: 0 13px; border-radius: 10px; font-size: 8.5px; font-weight: 600; }.reject-button { color: #a44640; background: #ffedeb; }.approve-button { color: white; background: #16996e; }.reviewed-note { margin: 0; padding-top: 12px; color: #88948f; border-top: 1px solid #edf1ef; font-size: 8px; }
.timeline { padding: 8px 23px 25px; }.timeline article { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid #edf1ef; }.timeline article > i { width: 9px; height: 9px; flex: 0 0 auto; margin-top: 4px; background: #1aa676; border: 3px solid #dff4ec; border-radius: 50%; box-sizing: content-box; }.timeline article > div { flex: 1; }.timeline article > div > div { display: flex; justify-content: space-between; }.timeline b { font-size: 9.5px; }.timeline span, .timeline small { color: #909b96; font-size: 7.5px; }.timeline p { margin: 6px 0; color: #4b5e56; font-size: 8.5px; }

.login-body { display: grid; grid-template-columns: minmax(420px,1.2fr) minmax(400px,.8fr); min-height: 100vh; background: white; }.login-decoration { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: 9vw; color: white; background: linear-gradient(135deg,#173f34,#075e47); }.login-decoration::before,.login-decoration::after { content: ""; position: absolute; border-radius: 50%; background: rgba(57,207,153,.09); }.login-decoration::before { width: 450px; height: 450px; top: -180px; right: -120px; }.login-decoration::after { width: 330px; height: 330px; bottom: -210px; left: -80px; }.login-brand { position: absolute; top: 45px; left: 9vw; display: flex; align-items: center; gap: 12px; }.login-brand b { font-size: 13px; letter-spacing: .22em; }.login-decoration h1 { position: relative; margin: 0; font-size: clamp(36px,4vw,58px); line-height: 1.22; letter-spacing: -.04em; }.login-decoration > p { position: relative; margin: 22px 0 0; color: rgba(255,255,255,.55); font-size: 12px; }.security-caption { position: absolute; bottom: 42px; left: 9vw; color: rgba(255,255,255,.42); font-size: 8px; letter-spacing: .08em; }
.login-card { width: min(370px,calc(100% - 60px)); margin: auto; }.login-mobile-brand { display: none; }.eyebrow { color: #149269; font-size: 8px; font-weight: 700; letter-spacing: .17em; }.login-card h2 { margin: 9px 0 6px; font-size: 27px; }.login-card > p { margin: 0 0 24px; color: #87938e; font-size: 10px; }.login-form { display: flex; flex-direction: column; gap: 15px; }.login-form label { display: flex; flex-direction: column; gap: 7px; color: #44574f; font-size: 9px; font-weight: 600; }.login-form input { height: 49px; padding: 0 13px; color: #20342c; background: #fbfcfb; border: 1px solid #dfe6e2; border-radius: 13px; outline: 0; font-size: 10px; }.login-form input:focus { border-color: #5dbb9a; box-shadow: 0 0 0 3px rgba(22,163,116,.08); }.primary-button { height: 49px; margin-top: 5px; color: white; background: linear-gradient(90deg,#15966b,#1bae7c); border-radius: 13px; box-shadow: 0 12px 25px rgba(18,148,104,.18); font-size: 10px; font-weight: 700; }.demo-account { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px; margin-top: 17px; color: #7d8984; background: #f1f5f3; border-radius: 12px; font-size: 8px; }.demo-account b { width: 100%; color: #53655e; }.demo-account span { padding: 4px 6px; background: white; border-radius: 6px; }
.error-page, .simple-error main { max-width: 450px; padding: 60px 20px; margin: 10vh auto; text-align: center; }.error-page strong, .simple-error strong { display: inline-grid; place-items: center; width: 70px; height: 70px; color: #168f67; background: #e4f5ed; border-radius: 22px; font-size: 22px; }.error-page h2, .simple-error h1 { margin: 17px 0 8px; }.error-page p, .simple-error p { color: #7e8b85; font-size: 10px; }.error-page a, .simple-error a { display: inline-block; padding: 10px 14px; margin-top: 10px; color: white; background: #16996e; border-radius: 10px; font-size: 9px; }

@media (max-width: 1160px) { .metric-grid { grid-template-columns: repeat(2,1fr); }.dashboard-grid { grid-template-columns: 1fr; }.withdrawal-details { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 860px) { .sidebar { transform: translateX(-102%); transition: transform .22s; box-shadow: 20px 0 50px rgba(9,35,27,.2); }.sidebar.open { transform: translateX(0); }.workspace { width: 100%; margin-left: 0; }.mobile-menu { display: block; }.admin-header { padding: 0 18px; }.admin-header > div:first-of-type { flex: 1; margin-left: 12px; }.admin-profile > span { display: none; }.content { padding: 20px 16px 40px; }.responsive-heading { align-items: flex-start; flex-direction: column; gap: 14px; }.filters-form { width: 100%; flex-wrap: wrap; }.filters-form input { flex: 1; }.login-body { display: block; background: #f6f8f7; }.login-decoration { display: none; }.login-card { padding: 70px 0; }.login-mobile-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 40px; }.login-mobile-brand b { letter-spacing: .16em; } }
@media (max-width: 580px) { .metric-grid { grid-template-columns: 1fr; }.metric-card { min-height: 110px; }.admin-profile form { display: none; }.withdrawal-details { grid-template-columns: 1fr; gap: 13px; }.review-actions { grid-template-columns: 1fr; }.review-banner { align-items: flex-start; gap: 10px; flex-direction: column; }.filters-form input,.filters-form select { width: 100%; min-width: 0; flex: 1 1 100%; }.filters-form button { height: 36px; }.content { padding: 15px 10px 35px; }.panel-heading { padding: 16px; }.withdrawal-list { padding: 10px; } }
