:root{--bg:#eef4f6;--paper:#f8fafb;--line:#1f2937;--muted-line:#c9d3df;--text:#132033;--muted:#64748b;--green:#10c875;--green-soft:#dcfce9;--blue:#2f7df6;--blue-soft:#deebff;--yellow:#ffc533;--yellow-soft:#fff4cc;--red:#ef476f;--red-soft:#ffe4ec;--violet:#8b5cf6;--shadow:#1e293b29;color:var(--text);font-family:Segoe UI,Arial,sans-serif}*{box-sizing:border-box}html,body{min-height:100vh;margin:0}body{background:linear-gradient(90deg, #10c87512 1px, transparent 1px), linear-gradient(#10c87512 1px, transparent 1px), var(--bg);background-size:24px 24px}button,input,select{font:inherit}button{cursor:pointer}.app-shell{width:min(1760px,100vw - 48px);margin:28px auto}.topbar,.access-modal,.panel,.metric,.tabs{border:1px solid var(--line);background:var(--paper);box-shadow:4px 5px 0 var(--shadow)}.topbar{justify-content:space-between;align-items:center;gap:20px;min-height:92px;padding:14px 18px;display:flex}.brand{align-items:center;gap:14px;min-width:0;display:flex}.brand-icon{object-fit:contain;width:58px;height:58px}.brand-logo{border:1px solid var(--muted-line);object-fit:contain;background:#fff;padding:5px}.brand-subtitle{color:var(--muted);margin-top:6px;font-size:13px;display:block}.eyebrow{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:0;font-size:12px}h1,h2{letter-spacing:0;margin:0;font-weight:650}h1{font-size:34px;line-height:1}h2{font-size:24px}.top-actions,.setup-actions{align-items:center;gap:10px;display:flex}.sync-pill{border:1px solid var(--line);background:var(--blue-soft);color:#17386c;text-align:center;min-width:190px;padding:10px 12px}.sync-pill.error{background:var(--red-soft);color:#9f1239}.sync-pill.ok{background:var(--green-soft);color:#047857}.ghost-btn,.primary-btn{border:1px solid var(--line);color:var(--text);background:#fff;min-height:42px;padding:0 16px;box-shadow:3px 3px #ffc533e6}.primary-btn{background:var(--green);color:#062014}.access-button{border:1px solid var(--line);color:var(--text);text-align:left;background:#fff;align-items:center;gap:10px;min-width:166px;min-height:58px;padding:8px 12px;display:flex;box-shadow:3px 3px #ffc533e6}.access-avatar{border:1px solid var(--line);background:var(--green);color:#062014;place-items:center;width:38px;height:38px;font-weight:800;display:grid}.access-button small,.access-field span{color:var(--muted);text-transform:uppercase;font-size:12px;display:block}.access-button strong{margin-top:3px;font-size:15px;font-weight:750;display:block}.access-backdrop{z-index:100;background:#0f172a38;justify-content:flex-end;align-items:flex-start;padding:28px max(24px,50vw + min(1760px,100vw - 48px)/-2);display:flex;position:fixed;inset:0}.access-modal{width:min(430px,100vw - 28px);padding:14px}.access-modal-head{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:16px;display:flex}.icon-button{border:1px solid var(--line);width:42px;height:42px;color:var(--text);background:#fff;place-items:center;font-size:24px;line-height:1;display:grid;box-shadow:3px 3px #ffc533e6}.access-field{gap:6px;display:grid}.access-hint{color:var(--muted);margin:8px 0 14px;font-size:13px}.access-modal .setup-actions{flex-wrap:wrap;justify-content:flex-end}.mobile-bottom-tabs{display:none}.mobile-tab{border:1px solid var(--line);color:var(--text);background:#fff}.mobile-tab span{border:1px solid var(--line);background:var(--blue-soft);color:#17386c;place-items:center;width:28px;height:28px;font-size:12px;font-weight:800;display:grid}.mobile-tab strong{font-size:13px;font-weight:750}.access-field input,.search-input,.period-control select{border:1px solid var(--line);color:var(--text);background:#fff;outline:none;min-height:44px;padding:0 12px}.access-field input:focus,.search-input:focus,.period-control select:focus{box-shadow:0 0 0 3px #2f7df62e}.summary-grid{grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0;display:grid}.metric{min-height:90px;padding:14px}.metric span{color:var(--muted);font-size:13px;display:block}.metric strong{margin-top:8px;font-size:28px;font-weight:650;display:block}.metric-green{background:var(--green-soft)}.metric-blue{background:var(--blue-soft)}.metric-yellow{background:var(--yellow-soft)}.metric-red{background:var(--red-soft)}.tabs{gap:8px;margin-bottom:10px;padding:8px;display:flex}.tab{background:0 0;border:1px solid #0000;min-height:44px;padding:0 18px}.tab.active{border-color:var(--line);background:var(--green-soft);box-shadow:3px 3px #ffc533e6}.workspace{grid-template-columns:minmax(680px,1.35fr) minmax(420px,.65fr);gap:12px;display:grid}.panel{min-height:360px}.panel-head{border-bottom:1px solid var(--line);background:var(--blue-soft);justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding:12px 14px;display:flex}.panel-head.compact{min-height:64px}.sales-controls{grid-template-columns:180px minmax(260px,520px);align-items:end;gap:10px;width:min(720px,62%);display:grid}.period-control{gap:4px;display:grid}.period-control span{color:var(--muted);text-transform:uppercase;font-size:11px}.period-control select{width:100%;min-height:44px}.search-input{width:100%}.sales-table-wrap{min-height:480px;max-height:calc(100vh - 340px);overflow:auto}.sales-table{border-collapse:collapse;table-layout:fixed;width:100%}.sales-table th,.sales-table td{border-right:1px solid var(--muted-line);border-bottom:1px solid var(--muted-line);vertical-align:middle;padding:9px 10px;font-size:13px}.sales-table th{background:var(--green-soft);color:#294256;text-transform:uppercase;font-size:12px;font-weight:600}.sales-table th:first-child{text-align:center;width:80px}.sales-table th:nth-child(2){width:150px}.sales-table th:nth-child(4){width:130px}.sales-table th:nth-child(5){width:135px}.sales-table th:nth-child(6){width:150px}.sales-table th:nth-child(7){text-align:right;width:120px}.sales-table tbody tr{background:#fff}.sales-table tbody tr:nth-child(2n){background:#f5f8fb}.sales-table tbody tr.active{outline-offset:-2px;background:#fff7d6;outline:2px solid #1e3a8a}.sales-table td:first-child{text-align:center;font-weight:700}.sales-table td:last-child{text-align:right;color:#047857;font-weight:700}.status-badge{border:1px solid var(--line);color:var(--text);background:#fff;padding:6px 10px;font-size:12px}.status-completed,.status-delivery_completed{background:var(--green-soft);color:#047857}.status-cancelled,.status-delivery_cancelled{background:var(--red-soft);color:#b91c1c}.status-pending,.status-delivery_pending,.status-waiting{background:var(--yellow-soft);color:#92400e}.empty-state{min-height:220px;color:var(--muted);text-align:center;place-items:center;gap:8px;padding:28px;display:grid}.empty-state strong{color:var(--text);font-size:18px}.empty-state span{max-width:420px}.empty-icon{border:1px solid var(--line);background:var(--yellow);color:#07111f;place-items:center;width:54px;height:54px;font-weight:800;display:grid;box-shadow:3px 3px #1e293b38}.detail-empty{color:var(--muted);text-align:center;padding:30px}.detail-content{padding:14px}.detail-meta{grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:12px;display:grid}.detail-box.wide{grid-column:span 2}.detail-box{border:1px solid var(--muted-line);background:#fff;padding:9px}.detail-box span{color:var(--muted);text-transform:uppercase;font-size:11px;display:block}.detail-box strong{margin-top:4px;font-size:15px;display:block}.items-list{border:1px solid var(--line);background:#fff}.item-row{border-bottom:1px solid var(--muted-line);grid-template-columns:1fr 86px 100px;gap:8px;padding:9px;font-size:13px;display:grid}.item-row:last-child{border-bottom:0}.item-row strong{display:block}.item-row span{color:var(--muted)}.item-options{color:#475569;margin-top:3px;font-size:12px;line-height:1.25;display:block}.detail-total{border:1px solid var(--line);background:var(--yellow-soft);justify-content:space-between;gap:10px;margin-top:12px;padding:12px;font-size:20px;font-weight:700;display:flex}.advanced-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.bars,.ranking{gap:10px;padding:14px;display:grid}.bar-row,.rank-row{grid-template-columns:minmax(120px,1fr) minmax(180px,2fr) 120px;align-items:center;gap:10px;min-height:38px;font-size:13px;display:grid}.bar-track{border:1px solid var(--line);background:#fff;height:16px}.bar-fill{min-width:2px;height:100%}.rank-row{border:1px solid var(--muted-line);background:#fff;grid-template-columns:36px minmax(150px,1fr) 120px;padding:9px}.rank-index{border:1px solid var(--line);background:var(--yellow);place-items:center;min-height:28px;font-weight:700;display:grid}.mobile-items-row{display:none}.mobile-sale-items{border:1px solid var(--line);background:#fff}.mobile-sale-items-head,.mobile-sale-item{border-bottom:1px solid var(--muted-line);grid-template-columns:64px minmax(0,1fr) 86px;align-items:start;gap:8px;padding:7px 8px;font-size:12px;display:grid}.mobile-sale-items-head{background:var(--green-soft);grid-template-columns:1fr auto;font-size:13px}.mobile-sale-item:last-child{border-bottom:0}.mobile-sale-item span{color:var(--muted)}.mobile-sale-item strong{font-weight:650}.mobile-sale-item em{color:#047857;text-align:right;font-style:normal;font-weight:700}.mobile-sale-item.empty{color:var(--muted);display:block}@media (max-width:900px){.app-shell{width:calc(100vw - 20px);margin:10px auto 18px;padding-bottom:84px}.topbar,.access-modal,.panel,.metric,.tabs{box-shadow:3px 4px 0 var(--shadow)}.topbar{flex-direction:column;align-items:flex-start;min-height:auto}.top-actions{width:100%}.sync-pill{flex:1}.desktop-access{display:none}h1{font-size:28px}.access-backdrop{justify-content:center;align-items:flex-end;padding:12px 10px 86px}.access-modal{width:100%;max-width:520px}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{min-height:76px}.metric strong{font-size:22px}.tabs{display:none}.mobile-bottom-tabs{z-index:90;border:1px solid var(--line);box-shadow:0 -8px 28px #1e293b24, 3px 4px 0 var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f8fafbf5;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px;display:grid;position:fixed;bottom:10px;left:10px;right:10px}.mobile-tab{justify-content:center;align-items:center;gap:7px;min-height:50px;padding:0 6px;display:flex}.mobile-tab.active{background:var(--green-soft);box-shadow:3px 3px #ffc533e6}.mobile-tab.active span{background:var(--green);color:#062014}.workspace,.advanced-grid{grid-template-columns:1fr}.panel-head{flex-direction:column;align-items:stretch;gap:10px}.search-input{width:100%}.sales-controls{grid-template-columns:1fr;width:100%}.sales-table-wrap{min-height:0;max-height:none}.sales-table,.sales-table thead,.sales-table tbody,.sales-table tr,.sales-table td{width:100%;display:block}.sales-table thead{display:none}.sales-table tbody tr:not(.mobile-items-row){border-bottom:1px solid var(--line);grid-template-columns:48px minmax(0,1fr) 96px;grid-template-areas:"id client total""date operator status""payment payment payment";align-items:center;gap:3px 8px;padding:7px 8px;display:grid}.sales-table td{border:0;min-width:0;padding:0;font-size:12px;line-height:1.2;display:block;text-align:left!important}.sales-table td:before{content:attr(data-label);color:var(--muted);text-transform:uppercase;font-size:11px;display:none}.sales-table tbody tr:not(.mobile-items-row) td:first-child{grid-area:id}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(2){color:var(--muted);grid-area:date}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(3){text-overflow:ellipsis;white-space:nowrap;grid-area:client;overflow:hidden}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(4){color:var(--muted);text-overflow:ellipsis;white-space:nowrap;grid-area:operator;overflow:hidden}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(5){color:var(--muted);grid-area:payment}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(6){grid-area:status;text-align:right!important}.sales-table tbody tr:not(.mobile-items-row) td:nth-child(7){grid-area:total}.sales-table .status-badge{padding:2px 5px;font-size:10px;display:inline-block}.mobile-items-row{border-bottom:1px solid var(--line);padding:0!important;display:block!important}.mobile-items-row td{display:block;padding:8px!important}.detail-panel{display:none}.detail-meta,.detail-box.wide,.item-row,.bar-row{grid-template-columns:1fr}.detail-box.wide{grid-column:auto}.bar-row{border:1px solid var(--muted-line);background:#fff;padding:8px}}