:root{--ink:#183233;--muted:#718282;--line:#dfe7e3;--paper:#f7f9f7;--teal:#177c76;--coral:#f26c59;--yellow:#e7b63e}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px "Noto Sans SC",Arial,sans-serif}.sidebar{width:236px;height:100vh;position:fixed;display:flex;flex-direction:column;padding:27px 15px 18px;background:#123f42;color:#d8e9e6}.brand{display:flex;align-items:center;gap:11px;padding:0 13px 31px;color:#fff;text-decoration:none;font-size:18px;font-weight:700}.brand-mark{width:29px;height:29px;display:grid;place-items:center;background:#f27461;color:#153f40;font-family:"DM Mono";font-size:17px;border-radius:7px}nav{display:grid;gap:5px}.nav-item{display:flex;align-items:center;gap:13px;padding:11px 13px;color:#b6ceca;text-decoration:none;border-radius:6px;transition:.2s}.nav-item span{font-size:17px;width:17px;text-align:center}.nav-item:hover,.nav-item.active{background:#21575a;color:#fff}.sidebar-bottom{margin-top:auto}.account{border-top:1px solid #316164;margin-top:14px;padding:17px 8px 0;display:flex;align-items:center;gap:9px}.avatar{background:#eab27b;color:#5a3423;width:31px;height:31px;border-radius:50%;display:grid;place-items:center;font-weight:700}.account strong,.account small{display:block}.account strong{font-size:12px;color:#fff}.account small{font-size:11px;color:#a5c3be;margin-top:2px}.more{margin-left:auto;color:#c6dfda;background:transparent;border:0;cursor:pointer}main{margin-left:236px;max-width:1560px;padding:38px 46px}.topbar,.header-actions,.section-title,.toolbar{display:flex;align-items:center}.topbar{justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:12px;color:var(--teal);font-weight:700;margin:0 0 5px}.topbar h1{font-size:25px;letter-spacing:0;margin:0;font-weight:700}.subhead{margin:6px 0 0;color:var(--muted);font-size:13px}.header-actions{gap:12px}.icon-button{width:39px;height:39px;border:1px solid var(--line);border-radius:6px;background:#fff;position:relative;font-size:18px;color:#46615f}.icon-button i{position:absolute;width:6px;height:6px;background:var(--coral);border-radius:50%;right:9px;top:8px}.primary{height:39px;background:var(--teal);color:#fff;border:0;border-radius:5px;padding:0 16px;font:600 13px inherit;cursor:pointer}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:22px}.metrics article,.card,.orders-panel{background:#fff;border:1px solid var(--line);border-radius:7px}.metrics article{padding:17px 18px;position:relative;min-height:131px;overflow:hidden}.metric-label{color:var(--muted);font-size:12px}.metric-value{font:600 28px "DM Mono",monospace;margin:10px 0 7px;letter-spacing:-1px}.money{font-size:22px}.metric-change{font-size:11px;font-weight:600}.metric-change span{font-weight:400;color:var(--muted);margin-left:3px}.up{color:#15926a}.down{color:#e56251}.sparkline{position:absolute;width:63px;height:31px;right:17px;bottom:17px;opacity:.7;background:linear-gradient(135deg,transparent 40%,currentColor 41% 45%,transparent 46% 55%,currentColor 56% 60%,transparent 61%),linear-gradient(45deg,transparent 42%,currentColor 43% 47%,transparent 48% 63%,currentColor 64% 68%,transparent 69%);color:var(--coral)}.sparkline.teal{color:var(--teal)}.sparkline.yellow{color:var(--yellow)}.sparkline.green{color:#2c9e78}.content-grid{display:grid;grid-template-columns:minmax(660px,1.68fr) minmax(305px,.85fr);gap:22px}.orders-panel{padding:22px 0 0;min-width:0}.section-title{justify-content:space-between;padding:0 22px}.section-title h2{font-size:16px;margin:0;font-weight:700}.section-title p{font-size:12px;color:var(--muted);margin:4px 0 0}.section-title a{font-size:12px;color:var(--teal);text-decoration:none;font-weight:600}.section-title a span{font-size:17px;margin-left:3px}.toolbar{justify-content:space-between;margin:22px 22px 15px}.tabs{display:flex;gap:4px}.tab{border:0;background:transparent;color:var(--muted);padding:7px 8px;font:12px inherit;cursor:pointer;border-radius:4px}.tab b{font:10px "DM Mono";padding:1px 4px;background:#edf1ef;color:#70817f;border-radius:8px;margin-left:3px}.tab.selected{background:#e9f4f1;color:var(--teal);font-weight:700}.tab.selected b{background:#cde7e1;color:var(--teal)}.search{border:1px solid var(--line);height:32px;border-radius:4px;display:flex;align-items:center;padding:0 9px;gap:4px;color:#78908d}.search input{border:0;outline:0;width:145px;font:12px inherit}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}th{background:#f7f9f8;color:#71807f;text-align:left;font-weight:500;padding:10px 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}td{padding:13px 14px;border-bottom:1px solid #edf1ef;color:#475d5b}td:first-child{color:#247b76;font-family:"DM Mono";font-size:11px}.customer{display:flex;align-items:center;gap:7px;color:var(--ink);font-weight:600}.customer .avatar{width:23px;height:23px;font-size:10px}.amount{font-family:"DM Mono";color:var(--ink)}.status{font-size:11px;padding:3px 7px;border-radius:9px;font-weight:600}.processing{background:#e4f3ef;color:#167a6e}.waiting{background:#fff3d8;color:#a77508}.done{background:#e7f4e9;color:#2c8d56}.exception{background:#fde8e4;color:#ca5144}.row-button{border:0;background:transparent;color:#6b7e7c;font-size:17px;cursor:pointer}.right-column{display:grid;align-content:start;gap:22px}.card{padding:22px}.select-button{border:1px solid var(--line);background:#fff;border-radius:4px;color:#536867;font:11px inherit;padding:6px 8px}.chart{display:flex;margin-top:22px;height:207px}.chart-scale{width:27px;display:flex;flex-direction:column;justify-content:space-between;padding-bottom:22px;color:#90a09d;font:10px "DM Mono"}.chart-area{flex:1;position:relative}.grid-lines{position:absolute;inset:0 0 22px;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(33.333% - 1px),#e6eeeb calc(33.333% - 1px),#e6eeeb 33.333%)}svg{width:100%;height:185px;position:absolute;inset:0}.days{position:absolute;bottom:0;left:0;width:100%;display:flex;justify-content:space-between;color:#90a09d;font-size:10px}.alerts .section-title{padding:0}.count{display:grid;place-items:center;background:#fde9e5;color:#d55c4d;width:23px;height:23px;border-radius:50%;font:12px "DM Mono"}.alert{display:flex;align-items:center;gap:10px;border-top:1px solid #edf1ef;padding:15px 0 0;margin-top:15px}.alert-icon{width:27px;height:27px;border-radius:7px;display:grid;place-items:center;font-weight:700}.red{background:#fde7e3;color:#d75548}.amber{background:#fff2d5;color:#bd8a13}.alert strong{font-size:12px}.alert p{font-size:11px;margin:3px 0 0;color:var(--muted)}.alert button{margin-left:auto;border:0;background:transparent;font-size:17px;color:#607674;cursor:pointer}dialog{border:0;border-radius:8px;padding:0;box-shadow:0 16px 50px #163a3a40;width:min(400px,calc(100% - 30px)}dialog::backdrop{background:#102a2a55}dialog form{padding:22px}.modal-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.modal-heading h2{font-size:17px;margin:0}.modal-heading button{border:0;background:transparent;font-size:22px;cursor:pointer}dialog label{display:block;color:#4d6260;font-size:12px;margin-top:12px}dialog input{display:block;width:100%;border:1px solid var(--line);border-radius:4px;padding:9px;margin-top:6px;font:13px inherit}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.modal-actions button:not(.primary){border:1px solid var(--line);background:#fff;border-radius:5px;padding:0 14px;height:39px;cursor:pointer}@media(max-width:1050px){main{padding:30px 25px}.content-grid{grid-template-columns:1fr}.right-column{grid-template-columns:1fr 1fr}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.sidebar{display:none}main{margin:0;padding:20px 14px}.topbar{align-items:flex-start}.topbar h1{font-size:20px}.header-actions .icon-button{display:none}.primary{padding:0 10px}.metrics{gap:9px}.metrics article{padding:13px;min-height:112px}.metric-value{font-size:22px}.sparkline{display:none}.content-grid{display:block}.right-column{display:grid;grid-template-columns:1fr;gap:15px;margin-top:15px}.orders-panel{overflow:hidden}.toolbar{align-items:flex-start;gap:10px;flex-direction:column}.search{width:100%}.search input{width:100%}.table-wrap{overflow-x:auto}.chart-card{display:block}}
