:root{--black:#090909;--soft:#111;--card:#171717;--card2:#1d1d1d;--line:#303030;--text:#f4f1e9;--muted:#a7a49d;--gold:#c6a15b;--gold2:#e5ca8e;--danger:#d26b61;--ok:#73a984;--radius:18px;--shadow:0 20px 55px #0008;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark}
*{box-sizing:border-box}[hidden]{display:none!important}html{background:var(--black)}body{margin:0;background:var(--black);color:var(--text);min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}.muted{color:var(--muted);margin:.35rem 0}.eyebrow{font-size:.7rem;letter-spacing:.18em;color:var(--gold);font-weight:800;margin:0 0 .5rem;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,5vw,3.6rem);margin-bottom:.35rem}h2{font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:.25rem}h3{margin:.25rem 0;font-size:1.05rem}
.login-view{min-height:100vh;display:grid;place-items:center;padding:22px;background:linear-gradient(90deg,#050505ee,#050505b8),url('assets/textura-cimento.png') center/cover}.login-card{width:min(430px,100%);padding:38px;border:1px solid #ffffff18;border-radius:24px;background:#0a0a0ae8;box-shadow:var(--shadow)}.login-logo{width:210px;max-height:110px;object-fit:contain;object-position:left;margin-bottom:24px}.form-stack{display:grid;gap:15px;margin-top:30px}
label{display:grid;gap:8px;color:#d8d4cc;font-size:.82rem;font-weight:650}input,select,textarea{width:100%;border:1px solid var(--line);background:#101010;color:var(--text);padding:13px 14px;border-radius:11px;outline:none;transition:.2s}input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px #c6a15b20}textarea{resize:vertical}.btn{border:1px solid var(--line);color:var(--text);background:#171717;border-radius:11px;padding:12px 17px;font-weight:750;transition:.18s}.btn:hover{transform:translateY(-1px);border-color:#5b5b5b}.btn.primary{background:var(--gold);color:#0a0a0a;border-color:var(--gold)}.btn.ghost{background:transparent}.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn.small{padding:8px 11px;font-size:.78rem}.text-btn{border:0;background:none;color:var(--gold);font-size:.8rem}.icon-btn{border:1px solid var(--line);background:#151515;color:#fff;border-radius:9px;padding:8px 11px}
.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:228px;background:#0d0d0d;border-right:1px solid #252525;padding:26px 17px;display:flex;flex-direction:column;z-index:20}.brand{height:100px;display:flex;align-items:flex-start;padding:0 8px 20px;border-bottom:1px solid #252525}.brand img{width:165px;height:80px;object-fit:contain;object-position:left}.nav{display:grid;gap:6px;margin-top:24px}.nav-item{border:0;background:transparent;color:#9d9b95;border-radius:10px;text-align:left;padding:12px 13px;font-weight:650;display:flex;gap:12px;align-items:center}.nav-item span{width:20px;text-align:center;font-size:1.1rem}.nav-item:hover,.nav-item.active{background:#ffffff0c;color:#fff}.nav-item.active{box-shadow:inset 3px 0 var(--gold)}.logout{margin-top:auto}.content{margin-left:228px;padding:42px clamp(24px,4vw,62px) 70px;min-height:100vh;background:linear-gradient(#090909f4,#090909fa),url('assets/textura-cimento.png') center/cover fixed}.page{display:none;max-width:1320px;margin:auto}.page.active{display:block;animation:fade .22s ease}@keyframes fade{from{opacity:.4;transform:translateY(5px)}}.page-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}.page-head .muted{font-size:.9rem}
.filter-toggle{display:none}.filter-panel{display:grid;grid-template-columns:repeat(6,minmax(115px,1fr)) auto;gap:10px;align-items:end;margin-bottom:20px;padding:14px;background:#121212;border:1px solid #292929;border-radius:14px}.filter-panel label{font-size:.68rem}.filter-panel select{padding:10px;font-size:.82rem}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}.metric{padding:21px;background:var(--card);border:1px solid #292929;border-radius:var(--radius);min-height:125px;display:flex;flex-direction:column;justify-content:center}.metric.featured{background:linear-gradient(135deg,#c6a15b,#8f6e36);color:#090909;border-color:transparent}.metric small{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;opacity:.75}.metric strong{font-size:clamp(1.6rem,2.7vw,2.25rem);margin:9px 0 4px}.metric span{font-size:.75rem;opacity:.65}.dashboard-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:14px}.panel{background:#141414;border:1px solid #292929;border-radius:var(--radius);padding:21px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-head small,.form-section-head small{font-size:.65rem;color:var(--gold);font-weight:800;letter-spacing:.12em}.chart-panel{min-height:330px}.chart{height:240px;display:flex;align-items:end;gap:8px;padding-top:15px}.month-bar-wrap{flex:1;height:100%;display:flex;flex-direction:column;justify-content:end;align-items:center;gap:8px}.month-bar{width:70%;min-width:8px;background:linear-gradient(var(--gold2),var(--gold));border-radius:6px 6px 2px 2px;min-height:2px;position:relative}.month-bar:hover:after{content:attr(data-value);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#000;padding:5px 7px;border-radius:6px;font-size:.65rem;z-index:3}.month-label{font-size:.63rem;color:#8e8b85}.bar-list{display:grid;gap:15px}.bar-row{display:grid;grid-template-columns:minmax(70px,1fr) 2fr auto;align-items:center;gap:10px;font-size:.75rem}.bar-track{height:7px;background:#292929;border-radius:10px;overflow:hidden}.bar-fill{height:100%;background:var(--gold);border-radius:10px}.bar-value{color:var(--muted)}.donut-wrap{display:flex;align-items:center;gap:25px;min-height:175px}.donut{width:128px;height:128px;border-radius:50%;position:relative;flex:none}.donut:after{content:"";position:absolute;inset:22px;border-radius:50%;background:#141414}.legend{display:grid;gap:8px;flex:1}.legend-row{display:flex;justify-content:space-between;gap:10px;font-size:.75rem}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px}.recent-list{display:grid}.recent-item{display:grid;grid-template-columns:1fr auto;gap:10px;padding:13px 0;border-bottom:1px solid #292929}.recent-item:last-child{border:0}.recent-item p{margin:0;font-size:.83rem;font-weight:700}.recent-item small{color:var(--muted)}.recent-item strong{font-size:.88rem}.empty{color:var(--muted);text-align:center;padding:38px 10px;font-size:.85rem}
.form-card{max-width:920px;padding:28px}.form-card.compact{max-width:760px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.span-2{grid-column:span 2}.form-section-head{display:flex;align-items:center;justify-content:space-between;margin:30px 0 12px;border-top:1px solid #292929;padding-top:24px}.cartridge-rows{display:grid;gap:9px;margin-bottom:20px}.cartridge-row{display:grid;grid-template-columns:1fr 110px 42px;gap:9px}.remove-row{border:1px solid #343434;background:#181818;color:#aaa;border-radius:10px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.form-error{margin:16px 0 0;padding:12px 14px;border:1px solid #8f4842;background:#d26b6118;color:#f0aaa4;border-radius:10px;font-size:.82rem}
.search-box{max-width:560px;border:1px solid var(--line);background:#131313;border-radius:12px;padding:0 14px;display:flex;align-items:center;color:var(--gold);margin-bottom:17px}.search-box input{border:0;background:transparent;box-shadow:none}.sales-list{display:grid;gap:10px}.sale-card{background:#141414;border:1px solid #292929;border-radius:14px;padding:18px;display:grid;grid-template-columns:95px 1.3fr 1fr 1fr auto;align-items:center;gap:15px}.sale-date strong{font-size:1.25rem}.sale-date small,.sale-meta small{display:block;color:var(--muted);font-size:.7rem}.sale-client strong{display:block}.sale-client span{color:var(--muted);font-size:.76rem}.sale-value{text-align:right}.sale-actions{display:flex;gap:5px}.sale-actions button{border:1px solid #333;background:#1a1a1a;color:#ddd;border-radius:8px;padding:7px 9px}.sale-actions .delete{color:#df8b83}
.stock-summary{margin-bottom:18px;color:var(--muted);font-size:.86rem}.stock-family{margin-bottom:28px}.stock-family-head{display:flex;align-items:end;gap:12px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid #303030}.stock-family-head h3{font-size:1.45rem;margin:0;color:var(--gold2)}.stock-family-head span{font-size:.75rem;color:var(--muted);padding-bottom:2px}.stock-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.stock-card{background:#151515;border:1px solid #2b2b2b;border-radius:15px;padding:19px}.stock-card.low{border-color:#8c593a}.stock-card h3{font-size:1.4rem}.stock-qty{font-size:2rem;font-weight:800;margin:15px 0 3px}.stock-card small{color:var(--muted)}.status{display:inline-flex;margin-top:13px;font-size:.67rem;font-weight:800;padding:5px 8px;border-radius:20px;background:#73a98420;color:#8cc29c}.status.low{background:#d26b6120;color:#e8958d}.purchase-history{max-width:760px;margin-top:15px}
.toast{position:fixed;top:18px;right:18px;z-index:100;background:#eee;color:#111;padding:12px 18px;border-radius:10px;box-shadow:var(--shadow);font-size:.82rem;font-weight:700;transform:translateY(-80px);opacity:0;transition:.25s}.toast.show{transform:none;opacity:1}.toast.error{background:#bb554d;color:#fff}.mobile-header,.bottom-nav{display:none}dialog{padding:0;border:1px solid #333;background:#141414;color:#fff;border-radius:18px;box-shadow:var(--shadow)}dialog::backdrop{background:#000b}.dialog-content{padding:28px;max-width:380px}
@media(max-width:1050px){.filter-panel{grid-template-columns:repeat(3,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{display:none}.mobile-header{height:68px;display:flex;position:fixed;inset:0 0 auto;z-index:30;background:#0c0c0cf2;border-bottom:1px solid #252525;align-items:center;justify-content:space-between;padding:8px 18px}.mobile-header img{width:130px;height:50px;object-fit:contain;object-position:left}.content{margin-left:0;padding:94px 15px 105px}.page-head{align-items:flex-start;margin-bottom:22px}.page-head>.btn{display:none}.filter-toggle{display:block;width:100%;margin-bottom:10px}.filter-panel{display:none;grid-template-columns:repeat(2,1fr);padding:12px}.filter-panel.open{display:grid}.metrics{gap:9px}.metric{padding:16px;min-height:108px}.metric strong{font-size:1.55rem}.dashboard-grid{grid-template-columns:1fr}.chart-panel{min-height:280px}.chart{height:210px}.panel{padding:17px}.form-card{padding:18px}.form-grid{grid-template-columns:1fr;gap:14px}.span-2{grid-column:auto}.cartridge-row{grid-template-columns:1fr 80px 40px}.sale-card{grid-template-columns:70px 1fr auto;padding:14px}.sale-meta{display:none}.sale-value{grid-column:3;grid-row:1}.sale-actions{grid-column:2/4;justify-content:flex-end}.stock-grid{grid-template-columns:repeat(2,1fr);gap:9px}.donut-wrap{gap:14px}.donut{width:110px;height:110px}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;height:72px;background:#0c0c0cf7;border-top:1px solid #2b2b2b;z-index:30;padding:5px 5px max(5px,env(safe-area-inset-bottom))}.bottom-nav button{border:0;background:none;color:#8f8c86;font-size:.62rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.bottom-nav span{font-size:1.15rem}.bottom-nav button.active{color:var(--gold)}.bottom-nav .new span{width:38px;height:38px;border-radius:50%;background:var(--gold);color:#080808;display:grid;place-items:center;margin-top:-20px;font-size:1.4rem}.toast{left:14px;right:14px;text-align:center}}
@media(max-width:400px){.metrics{grid-template-columns:1fr 1fr}.metric strong{font-size:1.35rem}.stock-grid{grid-template-columns:1fr}.filter-panel{grid-template-columns:1fr}}
