.tab-button.active{background-color:#3b82f6;color:#fff}.calculator-section{display:none;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.calculator-section.active{display:block;opacity:1;transform:translateY(0)}.basic-form,.change-form,.difference-form,.manipulation-form,.applied-form,.conversion-form{display:none;opacity:0;transform:translateY(5px);transition:opacity .2s ease,transform .2s ease}.basic-form.active,.change-form.active,.difference-form.active,.manipulation-form.active,.applied-form.active,.conversion-form.active{display:block;opacity:1;transform:translateY(0)}.basic-type-btn.active,.change-type-btn.active,.difference-type-btn.active,.manipulation-type-btn.active,.applied-type-btn.active,.conversion-type-btn.active{background-color:#3b82f6;color:#fff}.result-box{opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease;max-height:0;overflow:hidden}.result-box.visible{opacity:1;transform:translateY(0);max-height:500px;transition:opacity .3s ease,transform .3s ease,max-height .5s ease}input:focus,select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.2);transition:border-color .2s ease,box-shadow .2s ease}button{transition:all .2s ease}button:hover{transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}button:active{transform:translateY(0);box-shadow:none}.tab-button{transition:background-color .2s ease,color .2s ease,transform .2s ease}[id^="copy-"].copied{background-color:#10b981;color:#fff}@media (max-width:640px){.tab-button{font-size:.875rem;padding:.5rem .75rem}}