:root{--color-primary: #5a41f5;--color-secondary: #d44dda;--color-success: #28a745;--color-danger: #ff4f4f;--color-background: #f5f7fa;--color-text-dark: #333;--color-text-light: #ffffff;--shadow-sm: 0 4px 14px rgba(0, 0, 0, .09);--shadow-md: 0 8px 22px rgba(0, 0, 0, .07)}*,*:before,*:after{box-sizing:border-box}.page{background:var(--color-background);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color:var(--color-text-dark)}.header{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));padding:25px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom-left-radius:20px;border-bottom-right-radius:20px;color:var(--color-text-light);flex-wrap:wrap}.header h1{font-size:clamp(24px,5vw,30px);font-weight:700;margin:0}.logout-top{background:#ffffffe6;padding:10px 18px;border-radius:10px;border:none;cursor:pointer;color:var(--color-primary);font-weight:600;transition:.2s;margin-top:5px}.logout-top:hover{background:#fff;box-shadow:0 0 10px #0000001a}.auth-card{max-width:420px;background:#fff;margin:40px auto;padding:32px;border-radius:20px;box-shadow:0 8px 25px #00000014;animation:fadeIn .3s ease}.input-group{display:flex;gap:12px;flex-wrap:wrap}.input-group .input{flex:1 1 180px}.input{width:100%;padding:14px;border:1px solid #ddd;border-radius:12px;font-size:15px;margin-bottom:14px;transition:.2s}.input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #5a41f526;outline:none}.btn{background:var(--color-primary);color:#fff;padding:14px 20px;border-radius:12px;border:none;cursor:pointer;font-weight:600;transition:.2s;width:100%;text-align:center}.btn:hover{background:#4a33d0;box-shadow:0 4px 10px #0000001a}.search-card{max-width:650px;margin:30px auto;background:#fff;padding:30px;border-radius:18px;box-shadow:var(--shadow-md);text-align:center;animation:fadeIn .3s ease}.search-card h2{font-size:22px;font-weight:600;margin-bottom:18px}.input-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}.input-row .input{max-width:360px;margin-bottom:0}.input-row .btn{width:auto;flex-shrink:0}.grid{max-width:1250px;margin:30px auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;padding:0 20px}.card{background:#fff;border-radius:15px;position:relative;padding:10px;box-shadow:var(--shadow-sm)}.video{width:100%;height:360px;border-radius:12px;object-fit:cover}.dimmed{opacity:.45;pointer-events:none}.checkbox-overlay{position:absolute;top:16px;left:16px;z-index:20;cursor:pointer;display:flex;align-items:center}.checkbox-overlay input{position:absolute;opacity:0;height:0;width:0}.checkmark{height:30px;width:30px;background:#ffffffd9;border-radius:8px;border:2px solid var(--color-primary);display:flex;justify-content:center;align-items:center;font-size:20px;font-weight:700;color:transparent;transition:.2s transform,.2s background}.checkbox-overlay input:checked+.checkmark{background:var(--color-primary);color:#fff;transform:scale(1.1)}.panel,.select-panel{max-width:1250px;margin:20px auto;display:flex;justify-content:space-between;align-items:center;padding:0 20px;flex-wrap:wrap;gap:15px}.save-btn{background:var(--color-success)!important;width:auto;padding:10px 18px}.save-btn:hover{background:#218838!important}.cancel-btn{background:var(--color-danger);color:#fff;padding:10px 18px;border-radius:10px;border:none;width:auto}.cancel-btn:hover{background:#e60000}.footer{margin-top:60px;text-align:center;padding:20px;color:#888}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.page{background:#f5f7fa;min-height:100vh;font-family:Inter,sans-serif}.header{background:linear-gradient(135deg,#5a41f5,#d44dda);padding:25px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom-left-radius:20px;border-bottom-right-radius:20px;color:#fff}.logout-top{background:#ffffffe6;padding:10px 18px;border-radius:10px;border:none;cursor:pointer;color:#5a41f5;font-weight:700}.tabs{display:flex;justify-content:center;gap:20px;margin:30px auto}.tab{padding:12px 26px;background:#eee;border-radius:10px;cursor:pointer;border:none;font-weight:600}.tab.active{background:#5a41f5;color:#fff}.section-title{text-align:center;font-size:24px;font-weight:700;margin-top:10px}.source-username{text-align:center;margin-top:10px;color:#666}.empty-msg{text-align:center;margin-top:30px;color:#777}.checkbox-overlay input{opacity:0}.checkmark{height:30px;width:30px;background:#ffffffd9;border-radius:8px;border:2px solid #5a41f5;display:flex;justify-content:center;align-items:center;color:transparent}.checkbox-overlay input:checked+.checkmark{background:#5a41f5;color:#fff}.delete-btn{background:var(--color-danger)!important;color:#fff!important;padding:10px 18px;border-radius:10px;border:none;cursor:pointer;font-weight:600}.delete-btn:hover{background:#d60000!important}.popup{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000073;display:flex;justify-content:center;align-items:center;z-index:9999}.popup-inner{background:#fff;width:400px;max-height:80vh;padding:20px;border-radius:16px;display:flex;flex-direction:column;gap:15px}.product-list{max-height:350px;overflow-y:auto;border:1px solid #ddd;border-radius:12px;padding:10px}.product-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:10px;cursor:pointer;transition:.2s;border:1px solid transparent}.product-item:hover{background:#f2f1ff}.product-item.selected{border:2px solid #5a41f5;background:#ebe7ff}.product-img{width:50px;height:50px;object-fit:cover;border-radius:8px}.popup-actions{display:flex;justify-content:space-between;margin-top:10px}
