:root{--serif:"Cormorant Garamond", Georgia, serif;--mono:"IBM Plex Mono", "Courier New", monospace;--sans:"Inter", system-ui, sans-serif;--gold:#9b6f1e;--gold-dim:#c9943a;--ink:#1c1814;--bg:#faf9f7;--bg-100:#f2efe9;--bg-200:#e5e0d8;--stone:#8a8278;--pebble:#b5b0a8;--sidebar:#1c1814}*,:before,:after{box-sizing:border-box}body{font-family:var(--sans);background-color:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}h1,h2,h3{font-family:var(--serif);letter-spacing:.01em}.app-layout{flex-direction:row;min-height:100vh;display:flex}.sidebar{background-color:var(--sidebar);z-index:100;flex-direction:column;flex-shrink:0;width:216px;display:flex}.main-content{flex:1;padding:36px 40px;overflow:hidden auto}.sidebar-header{border-bottom:1px solid #ffffff0f;flex-direction:column;gap:14px;padding:28px 24px 18px;display:flex}.sidebar-footer{border-top:1px solid #ffffff0f;padding:18px 24px}.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{display:none}.nav-item{cursor:pointer;letter-spacing:.01em;border-left:2px solid #0000;align-items:center;gap:10px;padding:11px 24px;font-size:13px;font-weight:400;transition:background .1s,color .1s;display:flex}.nav-item:not(.active){color:#ffffff73}.nav-item:not(.active):hover{color:#ffffffb3;background:#ffffff0a}.nav-item.active{border-left-color:var(--gold);background:#9b6f1e1f;color:var(--gold-dim)!important}.grid-4{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}.grid-2{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;display:grid}.grid-detail{grid-template-columns:1fr 316px;gap:20px;display:grid}.card{border:1px solid var(--bg-200);background:#fff;border-radius:10px;padding:22px 24px}.modal-overlay{z-index:1000;background:#1c181480;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-content{background:#fff;border-radius:12px;width:100%;max-width:500px;max-height:90vh;padding:28px;overflow-y:auto}.header-actions{justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px;display:flex}.table-header{background:var(--bg);border-bottom:1px solid var(--bg-200);color:var(--pebble);letter-spacing:.09em;text-transform:uppercase;padding:10px 18px;font-size:10.5px;font-weight:500;display:grid}.table-row{border-bottom:1px solid var(--bg-100);cursor:pointer;background:#fff;align-items:center;padding:13px 18px;transition:background .1s;display:grid}.table-row:hover{background:var(--bg)}.col-order{grid-template-columns:76px 1fr 130px 100px 130px 110px}.col-customer{grid-template-columns:1fr 130px 120px 100px}.mobile-card{border:1px solid var(--bg-200);background:#fff;border-radius:10px;margin-bottom:10px;padding:16px 18px}.mobile-card-row{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.mobile-card-footer{border-top:1px solid var(--bg-100);justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;display:flex}input,textarea,select{font-family:var(--sans);color:var(--ink)}input:focus,textarea:focus,select:focus{outline-offset:0;outline:2px solid #9b6f1e59}.mono{font-family:var(--mono);letter-spacing:-.01em}.serif{font-family:var(--serif)}.label{letter-spacing:.08em;text-transform:uppercase;color:var(--pebble);font-size:10.5px;font-weight:500}@media (width<=1024px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-detail{grid-template-columns:1fr}.main-content{padding:28px}}@media (width<=768px){.app-layout{flex-direction:column}.sidebar{border-top:1px solid #ffffff12;flex-direction:row;width:100%;height:60px;position:fixed;bottom:0;left:0;right:0}.sidebar-header,.sidebar-footer{display:none!important}.sidebar-nav{-webkit-overflow-scrolling:touch;flex-direction:row;padding:0;display:flex;overflow:auto hidden}.nav-item{border-bottom:2px solid #0000;flex-direction:column;justify-content:center;gap:3px;min-width:66px;padding:7px 10px;border-left:none!important}.nav-item i{margin-bottom:2px;font-size:18px!important}.nav-item span{text-align:center;letter-spacing:0;font-size:9.5px;display:block}.nav-item.active{border-bottom-color:var(--gold);background:0 0;color:var(--gold-dim)!important;border-left:none!important}.main-content{padding:18px 16px 76px}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.header-actions{flex-direction:column;align-items:stretch}}
