#resistor-calc .container{max-width:1000px;margin:0 auto;padding:20px}#resistor-calc header{text-align:center;margin-bottom:30px;padding:20px 0;border-bottom:1px solid #ddd}#resistor-calc header h1{color:#2c3e50;margin-bottom:10px}#resistor-calc header p{color:#7f8c8d}#resistor-calc h2,#resistor-calc h3{color:#2c3e50;margin-bottom:15px}#resistor-calc .resistor-type-selector{margin-bottom:30px}#resistor-calc .type-buttons{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}#resistor-calc .type-btn{display:flex;flex-direction:column;align-items:center;padding:15px;background-color:#fff;border:2px solid #ddd;border-radius:8px;cursor:pointer;transition:all .3s ease;min-width:120px}#resistor-calc .type-btn i{font-size:24px;margin-bottom:10px;color:#3498db}#resistor-calc .type-btn span{font-size:14px;font-weight:bold}#resistor-calc .type-btn:hover{border-color:#3498db;transform:translateY(-3px);box-shadow:0 5px 15px rgba(0,0,0,.1)}#resistor-calc .type-btn.active{border-color:#3498db;background-color:#ebf5fb}#resistor-calc .resistor-display{display:flex;justify-content:center;margin:20px 0}#resistor-calc .resistor-body{position:relative;width:300px;height:60px;background-color:#e6ccb3;border-radius:30px;display:flex;align-items:center;justify-content:space-around;padding:0 30px}#resistor-calc .band{width:10px;height:50px;background-color:#ddd;border-radius:2px}#resistor-calc .band-selectors{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:30px;justify-content:center}#resistor-calc .band-selector{flex:1;min-width:200px}#resistor-calc .band-selector label{display:block;margin-bottom:10px;font-weight:bold}#resistor-calc .color-picker{display:flex;flex-wrap:wrap;margin:-2.5px}#resistor-calc .color-picker>*{flex:0 0 calc(20% - 5px);margin:2.5px;box-sizing:border-box;display:flex;justify-content:center;align-items:center}#resistor-calc .color-picker img,#resistor-calc .color-picker svg,#resistor-calc .color-picker .icon{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}#resistor-calc .color{width:30px;height:30px;cursor:pointer;border:2px solid transparent;transition:all .2s ease}#resistor-calc .color:hover{transform:scale(1.1)}#resistor-calc .color.selected{border-color:#333;box-shadow:0 0 5px rgba(0,0,0,.3)}#resistor-calc .black{background-color:#000}#resistor-calc .brown{background-color:#8b4513}#resistor-calc .red{background-color:red}#resistor-calc .orange{background-color:#ffa500}#resistor-calc .yellow{background-color:#ff0}#resistor-calc .green{background-color:green}#resistor-calc .blue{background-color:#00f}#resistor-calc .violet{background-color:#8a2be2}#resistor-calc .grey{background-color:gray}#resistor-calc .white{background-color:#fff;border:1px solid #ddd}#resistor-calc .gold{background-color:#ffd700}#resistor-calc .silver{background-color:silver}#resistor-calc .result-section{background-color:#f9f9f9;padding:20px;border-radius:8px;margin-bottom:30px}#resistor-calc .result{font-size:18px;margin-bottom:15px;padding:15px;background-color:#fff;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.1)}#resistor-calc .calculation-details{font-size:14px;color:#666;line-height:1.5}#resistor-calc .examples{margin-top:30px}#resistor-calc .example-items{display:flex;flex-wrap:wrap;gap:15px}#resistor-calc .example-item{display:flex;flex-direction:column;align-items:center;padding:10px;background-color:#f9f9f9;border-radius:5px;cursor:pointer;transition:all .2s ease}#resistor-calc .example-item:hover{background-color:#eee;transform:translateY(-3px)}#resistor-calc .mini-resistor{width:100px;height:20px;background-color:#e6ccb3;border-radius:10px;display:flex;align-items:center;justify-content:space-around;margin-bottom:5px}#resistor-calc .mini-band{width:4px;height:16px;border-radius:1px}#resistor-calc .numeric-code,.alphanumeric-code{font-size:16px;font-weight:bold;padding:5px 10px;background-color:#e6ccb3;border-radius:5px;margin-bottom:5px}#resistor-calc .input-section{margin-bottom:20px}#resistor-calc .input-section label{display:block;margin-bottom:10px;font-weight:bold}#resistor-calc .input-section input{width:1100px;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:16px;margin-bottom:10px}#resistor-calc .input-section button{padding:10px 20px;background-color:#3498db;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px;transition:background-color .3s ease}#resistor-calc .input-section button:hover{background-color:#2980b9}@media(max-width:768px){#resistor-calc .type-buttons{flex-direction:column;align-items:center}#resistor-calc .type-btn{width:100%;max-width:300px}#resistor-calc .band-selectors{flex-direction:column}#resistor-calc .band-selector{width:100%}}#resistor-calc #color-band-6-calculator .resistor-body{width:350px;justify-content:space-evenly}#resistor-calc #color-band-6-calculator .mini-resistor{width:120px}