:root{--primary-color: #667eea;--secondary-color: #764ba2;--success-color: #4caf50;--warning-color: #ff9800;--error-color: #f44336;--text-color: #333;--light-bg: #f8f9fa;--white: #ffffff;--border-radius: 10px;--box-shadow: 0 4px 20px rgba(0, 0, 0, .1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:var(--text-color);background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);min-height:100vh}.header{text-align:center;padding:40px 20px;color:var(--white)}.header h1{font-size:3rem;margin-bottom:10px;font-weight:300;text-shadow:0 2px 10px rgba(0,0,0,.2)}.header p{font-size:1.2rem;opacity:.9}.container{max-width:1200px;margin:0 auto;padding:0 20px 40px}.demo-card{background:var(--white);border-radius:20px;box-shadow:var(--box-shadow);padding:40px;margin-bottom:30px}.section-title{font-size:1.8rem;margin-bottom:20px;color:var(--text-color);border-bottom:3px solid var(--primary-color);padding-bottom:10px;font-weight:500}.detection-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.info-card{background:var(--light-bg);border-radius:var(--border-radius);padding:20px;border:1px solid var(--primary-color);transition:transform .2s ease}.info-card:hover{transform:translateY(-2px)}.info-card h3{color:var(--primary-color);margin-bottom:10px;font-size:1.1rem}.info-card p{color:#666;font-size:1rem;font-weight:500}.results-section h3{margin-bottom:15px;color:var(--text-color)}.device-match{background:linear-gradient(90deg,#e8f5e8,#f0f8f0);border:1px solid var(--success-color);border-radius:var(--border-radius);padding:20px;margin-bottom:15px;transition:all .3s ease}.device-match:hover{transform:translate(5px);box-shadow:0 5px 15px #4caf5033}.device-name{font-size:1.3rem;font-weight:600;color:var(--success-color);margin-bottom:8px}.device-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:10px}.device-info span{background:#4caf501a;padding:5px 10px;border-radius:5px;font-size:.9rem}.confidence-badge{display:inline-block;background:var(--success-color);color:var(--white);padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:600;margin-left:10px}.no-matches{text-align:center;padding:40px;color:#666;font-style:italic}.loading{text-align:center;padding:20px;color:var(--primary-color);font-weight:500}.manual-form,.config-form{background:var(--light-bg);padding:30px;border-radius:var(--border-radius);margin-bottom:20px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;font-weight:600;color:var(--text-color)}.form-group input,.form-group select{width:100%;padding:12px;border:2px solid #ddd;border-radius:var(--border-radius);font-size:1rem;transition:border-color .3s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a}.form-group input[type=range]{width:calc(100% - 60px);margin-right:10px}.checkbox-group{display:flex;gap:20px;flex-wrap:wrap}.checkbox-group label{display:flex;align-items:center;margin-bottom:0;cursor:pointer}.checkbox-group input{width:auto;margin-right:8px}.btn-primary,.btn-secondary{background:var(--primary-color);color:var(--white);border:none;padding:12px 24px;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-primary:hover{background:#5a6fd8;transform:translateY(-2px);box-shadow:0 5px 15px #667eea4d}.btn-secondary{background:var(--secondary-color)}.btn-secondary:hover{background:#6a4190;transform:translateY(-2px);box-shadow:0 5px 15px #764ba24d}.disclaimer{background:#fff3cd;border:1px solid #ffeaa7;border-radius:var(--border-radius);padding:15px;margin-top:20px;color:#856404}ul{padding-left:20px;margin:15px 0}code{background:var(--light-bg);padding:2px 6px;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;color:var(--primary-color)}@media (max-width: 768px){.header h1{font-size:2rem}.demo-card{padding:20px}.detection-info,.device-info{grid-template-columns:1fr}.checkbox-group{flex-direction:column;gap:10px}}