*{box-sizing:border-box}:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#172033;background:#f5f7fb;font-synthesis:none;text-rendering:optimizeLegibility}body{margin:0;min-width:320px;background:#f5f7fb}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}.topbar{height:76px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #e8ebf2;position:sticky;top:0;z-index:10}.brand,.topbar-right,.card-actions,.form-actions{display:flex;align-items:center}.brand{gap:12px}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:#111827;color:#fff;font-weight:800}.brand-title{font-weight:750;letter-spacing:-.02em}.brand-subtitle,.muted{color:#7a8498;font-size:13px}.topbar-right{gap:24px}.stat{display:flex;align-items:baseline;gap:7px}.stat-value{font-weight:750}.stat-label{color:#8992a5;font-size:12px}.primary-button,.secondary-button,.danger-button,.icon-button{border:0;border-radius:9px;padding:10px 15px;font-weight:650;transition:.15s ease}.primary-button{background:#111827;color:#fff}.primary-button:hover{background:#273142}.secondary-button{background:#eef1f6;color:#263146}.secondary-button:hover{background:#e3e7ee}.danger-button{background:#fff0f0;color:#b42318}.danger-button:hover{background:#ffe1e1}.page{max-width:1240px;margin:0 auto;padding:42px 24px 70px}.hero{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:28px}.eyebrow{margin:0 0 8px;font-size:11px;font-weight:800;letter-spacing:.15em;color:#758198}.hero h1{margin:0;font-size:clamp(28px,4vw,44px);letter-spacing:-.04em}.hero-copy{color:#727d91;margin:10px 0 0}.search-box{width:min(340px,100%);background:#fff;border:1px solid #e1e5ec;border-radius:11px;padding:0 13px;height:45px;display:flex;align-items:center;gap:9px}.search-box span{color:#7f899b;font-size:20px}.search-box input{border:0;outline:0;width:100%;background:transparent}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.product-card{background:#fff;border:1px solid #e5e8ef;border-radius:14px;overflow:hidden;box-shadow:0 8px 28px #1924370a}.image-button{width:100%;height:210px;border:0;padding:0;background:#f0f2f6;overflow:hidden}.image-button img,.details-image{width:100%;height:100%;object-fit:cover}.image-placeholder{width:100%;height:100%;display:grid;place-items:center;color:#929bad;font-size:13px;background:#eef1f5}.product-card-body{padding:17px}.product-heading{display:flex;justify-content:space-between;gap:12px;align-items:start}.title-button{border:0;background:none;padding:0;text-align:left;font-weight:750;color:#182235;font-size:16px}.status{flex:0 0 auto;font-size:10px;font-weight:800;padding:5px 8px;border-radius:999px;letter-spacing:.05em}.status-active{color:#087443;background:#e5f7ed}.status-draft{color:#8a5b00;background:#fff3d7}.status-archived{color:#667085;background:#edf0f4}.card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.card-metrics div{display:grid;gap:3px}.card-metrics span,.detail-grid span{font-size:11px;color:#8992a5}.card-metrics strong{font-size:13px}.card-actions{gap:7px}.card-actions button{flex:1;padding:8px 10px;font-size:12px}.load-more{display:flex;justify-content:center;padding:28px 0}.load-button{min-width:190px}.state-card{background:#fff;border:1px dashed #d8dde7;border-radius:14px;min-height:300px;display:grid;place-items:center;align-content:center;gap:8px;text-align:center;padding:30px}.state-card h3,.state-card p{margin:0}.state-card p{color:#7b8496}.empty-icon{font-size:30px;color:#8a94a8}.spinner{width:28px;height:28px;border:3px solid #dce1e9;border-top-color:#111827;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.alert{border-radius:10px;padding:12px 14px;margin-bottom:18px;font-size:13px}.alert.error{background:#fff0f0;border:1px solid #ffd1d1;color:#9d1c1c}.global-alert{display:flex;align-items:center;justify-content:space-between;gap:12px}.global-alert button{border:0;background:transparent;color:inherit;text-decoration:underline}.modal-backdrop{position:fixed;inset:0;background:#11182773;display:grid;place-items:center;padding:20px;z-index:50}.modal{width:min(620px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 25px 80px #0003}.modal-wide{width:min(880px,100%)}.modal-header{position:sticky;top:0;background:#fff;padding:18px 20px;border-bottom:1px solid #edf0f4;display:flex;align-items:center;justify-content:space-between;z-index:2}.modal-header h2{margin:0;font-size:20px}.icon-button{padding:2px 9px;background:#f0f2f5;color:#3d4656;font-size:24px}.modal-content{padding:22px}.form{display:grid;gap:18px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.form label{display:grid;gap:7px;font-size:13px;font-weight:650}.form input,.form textarea,.form select{width:100%;border:1px solid #d9dee7;border-radius:9px;padding:11px 12px;outline:0;background:#fff;color:#172033}.form input:focus,.form textarea:focus,.form select:focus{border-color:#8b95a8;box-shadow:0 0 0 3px #1118270f}.form textarea{resize:vertical}.form small{color:#8a94a7;font-weight:400}.form-actions{justify-content:flex-end;gap:9px}.details{display:grid;gap:22px}.details-top{display:grid;grid-template-columns:250px 1fr;gap:22px}.details-image{height:250px;border-radius:12px}.details-top h2{margin:9px 0 5px}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.detail-grid>div{display:grid;gap:4px;background:#f7f8fa;border-radius:9px;padding:11px}.id-text{font-size:11px;word-break:break-all}.variant-table-wrap{overflow-x:auto;border:1px solid #e5e8ef;border-radius:10px}.variant-table{width:100%;border-collapse:collapse;min-width:650px}.variant-table th,.variant-table td{text-align:left;padding:11px 12px;border-bottom:1px solid #edf0f4;font-size:12px}.variant-table th{color:#7b8495;font-weight:700;background:#fafbfc}.variant-table tr:last-child td{border-bottom:0}@media(max-width:980px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{align-items:stretch;flex-direction:column}.search-box{width:100%}}@media(max-width:680px){.topbar{height:auto;padding:14px 16px;gap:15px;align-items:flex-start}.topbar-right{gap:8px}.stat{display:none}.page{padding:28px 15px 50px}.product-grid,.form-grid,.details-top,.detail-grid{grid-template-columns:1fr}.details-image{height:220px}.brand-title{font-size:13px}.brand-subtitle{font-size:11px}}
