:root{--bg:#0f1115;--panel:#171a21;--panel2:#1f2430;--line:#2a3140;--text:#f4f6f8;--muted:#9aa4b2;--accent:#d4af37;--danger:#e15353;--warn:#d89d32;--ok:#42a66f}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Arial,Helvetica,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.wrap{min-height:100vh}.center{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;width:min(440px,100%);padding:28px;box-shadow:0 18px 60px #00000059}.brand{letter-spacing:1px;font-size:28px;font-weight:800}.brand span{color:var(--accent)}.sub{color:var(--muted);margin:8px 0 24px}.field{margin:14px 0}label{color:#c7ced8;margin-bottom:8px;font-size:13px;display:block}input,select{border:1px solid var(--line);width:100%;color:var(--text);background:#0f131a;border-radius:10px;outline:none;padding:13px 14px}input:focus,select:focus{border-color:var(--accent)}.primary,.secondary,.danger,.ghost{border:0;border-radius:10px;padding:12px 16px;font-weight:700}.primary{background:var(--accent);color:#111}.secondary{color:#fff;background:#283142}.danger{background:var(--danger);color:#fff}.ghost{color:#d7dde5;border:1px solid var(--line);background:0 0}.row{align-items:center;gap:10px;display:flex}.row>*{flex:1}.linkbtn{color:var(--accent);background:0 0;border:0;padding:0}.note{color:#b9c5d4;background:#101722;border:1px solid #22304a;border-radius:10px;margin-top:14px;padding:12px 14px;font-size:14px}.shell{grid-template-columns:240px 1fr;min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);background:#11141a;height:100vh;padding:22px 16px;position:sticky;top:0}.logo{margin:0 8px 28px;font-size:24px;font-weight:900}.logo b{color:var(--accent)}.nav button{text-align:left;color:#cbd3dd;background:0 0;border:0;border-radius:10px;width:100%;margin:4px 0;padding:12px 14px}.nav button:hover,.nav button.active{color:#fff;background:#202633}.main{padding:24px}.topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;display:flex}.title{font-size:26px;font-weight:800}.userbox{color:var(--muted);font-size:14px}.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}.metric{margin-top:8px;font-size:28px;font-weight:800}.muted{color:var(--muted)}.section{margin-top:18px}.table-wrap{border:1px solid var(--line);background:var(--panel);border-radius:14px;overflow:auto}table{border-collapse:collapse;width:100%;min-width:760px}th,td{border-bottom:1px solid var(--line);text-align:left;padding:14px 16px;font-size:14px}th{color:#b6c0cd;background:#131821}.badge{border-radius:999px;padding:5px 9px;font-size:12px;font-weight:700;display:inline-block}.new{color:#ff8080;background:#e1535329}.pending{color:#f1b758;background:#d89d3229}.done{color:#71d69b;background:#42a66f29}.toolbar{flex-wrap:wrap;gap:10px;margin-bottom:12px;display:flex}.toolbar input{max-width:320px}.toast{border:1px solid #39445a;border-left:4px solid var(--accent);z-index:1000;background:#1d2330;border-radius:12px;width:min(360px,100vw - 44px);padding:16px;position:fixed;top:22px;right:22px;box-shadow:0 12px 36px #00000059}.toast strong{margin-bottom:6px;display:block}.small{color:var(--muted);font-size:12px}.actions{flex-wrap:wrap;gap:8px;display:flex}.approval{border-bottom:1px solid var(--line);grid-template-columns:1fr auto;align-items:center;gap:14px;padding:14px 0;display:grid}.approval:last-child{border-bottom:0}.order-detail-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.kv{grid-template-columns:110px 1fr;gap:8px 12px;font-size:14px;display:grid}.kv div:nth-child(odd){color:var(--muted)}@media (width<=900px){.shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line);height:auto;position:relative}.nav{gap:4px;display:flex;overflow:auto hidden}.nav button{white-space:nowrap;flex:none;width:auto}.sidebar>.small{margin-top:12px;position:static!important}.grid{grid-template-columns:repeat(2,1fr)}}@media (width<=560px){.main{padding:16px}.grid{grid-template-columns:1fr}.row{flex-direction:column}.order-detail-grid{grid-template-columns:1fr}}@media print{.sidebar,.topbar,.actions,.toast,.no-print{display:none!important}body{color:#000;background:#fff}.main{padding:0}.card,.table-wrap{background:#fff;border:0}}