*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:20px}.container{max-width:800px;margin:0 auto}.card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 10px 40px #0000001a;margin-bottom:20px}.accordion-card{padding:0;overflow:hidden}.accordion-header{display:flex;justify-content:space-between;align-items:center;padding:24px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s}.accordion-header:hover{background-color:#f8f9fa}.accordion-header h2{margin-bottom:0;flex:1}.accordion-icon{font-size:.9rem;color:#667eea;transition:transform .3s;margin-left:16px}.accordion-content{max-height:0;overflow:hidden;transition:max-height .3s ease-out,padding .3s ease-out;padding:0 24px}.accordion-content.expanded{max-height:5000px;padding:0 24px 24px}.accordion-content .card{margin-bottom:0;box-shadow:none;padding:0}.accordion-content .card h2{display:none}h1{color:#333;margin-bottom:24px;text-align:center}h2{color:#555;margin-bottom:16px;font-size:1.5rem}.form-group{margin-bottom:16px}label{display:block;margin-bottom:8px;color:#555;font-weight:500}input[type=number],input[type=text]{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .3s}input[type=number]:focus,input[type=text]:focus{outline:none;border-color:#667eea}button{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .3s}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#667eea;color:#fff}.btn-primary:hover:not(:disabled){background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-danger{background:#e74c3c;color:#fff}.btn-danger:hover:not(:disabled){background:#c0392b;transform:translateY(-2px);box-shadow:0 4px 12px #e74c3c66}.btn-warning{background:#f39c12;color:#fff}.btn-warning:hover:not(:disabled){background:#d68910;transform:translateY(-2px);box-shadow:0 4px 12px #f39c1266}.btn-secondary{background:#95a5a6;color:#fff}.btn-secondary:hover:not(:disabled){background:#7f8c8d;transform:translateY(-2px);box-shadow:0 4px 12px #95a5a666}.btn-success{background:#27ae60;color:#fff}.btn-success:hover:not(:disabled){background:#229954;transform:translateY(-2px);box-shadow:0 4px 12px #27ae6066}.timer-configs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:20px}.timer-config-card{background:#f8f9fa;border:2px solid #e0e0e0;border-radius:12px;padding:16px;cursor:pointer;transition:all .3s}.timer-config-card:hover{border-color:#667eea;transform:translateY(-4px);box-shadow:0 4px 12px #0000001a}.timer-config-card.active{border-color:#667eea;background:#e8ebff}.timer-config-label{font-weight:600;font-size:1.1rem;color:#333;margin-bottom:8px}.timer-config-details{font-size:.9rem;color:#666;line-height:1.6}.timer-display{text-align:center;padding:40px 20px}.timer-time{font-size:5rem;font-weight:700;color:#333;margin:20px 0;font-variant-numeric:tabular-nums}.timer-status{font-size:1.2rem;color:#666;margin-bottom:30px}.timer-controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}.timer-info{background:#f8f9fa;border-radius:8px;padding:16px;margin-bottom:20px}.timer-info-item{display:flex;justify-content:space-between;margin-bottom:8px;color:#555}.timer-info-item:last-child{margin-bottom:0}.error-message{background:#fee;color:#c33;padding:12px;border-radius:8px;margin-bottom:16px;border:1px solid #fcc}.success-message{background:#efe;color:#3c3;padding:12px;border-radius:8px;margin-bottom:16px;border:1px solid #cfc}.empty-state{text-align:center;padding:40px 20px;color:#999}.empty-state-icon{font-size:4rem;margin-bottom:16px}.form-actions{display:flex;gap:12px;margin-top:20px}.edit-btn{background:#3498db;color:#fff;padding:6px 12px;font-size:.85rem}.edit-btn:hover:not(:disabled){background:#2980b9}.delete-btn{background:#e74c3c;color:#fff;padding:6px 12px;font-size:.85rem}.delete-btn:hover:not(:disabled){background:#c0392b}.actions{display:flex;gap:12px;margin-top:20px}@media (max-width: 600px){.card{padding:16px}.timer-display{padding:20px 10px}.timer-time{font-size:3.5rem;margin:12px 0}.timer-status{margin-bottom:16px;font-size:1rem}.timer-info{padding:12px;margin-bottom:12px}.timer-info-item{margin-bottom:4px;font-size:.9rem}.timer-controls{flex-direction:column;margin-top:16px;gap:8px}.timer-controls button{width:100%;padding:10px 20px}h2{margin-bottom:12px;font-size:1.3rem}.accordion-header{padding:16px}}
