.calculator{margin:2rem auto;padding:2rem;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);border-radius:22px;box-shadow:0 10px 30px rgba(26,75,95,.08);border:1px solid #d9e3ee;position:relative;overflow:hidden}.calculator::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(107,158,158,.12),transparent 38%),radial-gradient(circle at bottom left,rgba(26,75,95,.08),transparent 35%);pointer-events:none}.calculator-title{text-align:center;margin-bottom:2rem;color:#1a4b5f;font-size:1.5rem;font-weight:700;position:relative;z-index:1}.calculator-form{display:flex;flex-direction:column;gap:1.5rem;position:relative;z-index:1}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.form-group{display:flex;flex-direction:column}.form-group label{margin-bottom:0.5rem;font-weight:700;color:#2e546a;font-size:0.95rem}.form-control{padding:0.875rem 1rem;border:1.5px solid #ecdca8;border-radius:12px;font-size:1rem;transition:border-color .2s ease,box-shadow .2s ease;background:#fefcf5;color:#1a3f5c;width:100%}.form-control:focus{outline:none;border-color:#1a4b5f;box-shadow:0 0 0 4px rgba(26,75,95,.08);background:#fff}.operation-select-group{position:relative;margin:1rem 0}.operation-select-label{display:block;margin-bottom:0.5rem;font-weight:700;color:#2e546a;font-size:0.95rem}.operation-select{width:auto;max-width:400px;padding:0.875rem 1rem;border:1.5px solid #ecdca8;border-radius:12px;background:#fefcf5;font-size:1rem;color:#1a3f5c;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease}.operation-select:focus{outline:none;border-color:#1a4b5f;box-shadow:0 0 0 4px rgba(26,75,95,.08);background:#fff}.calculate-btn{padding:0.875rem 2.5rem;background:linear-gradient(135deg,#1a4b5f 0%,#2b6a79 100%);color:#fff;border:0;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;margin:0.5rem auto 0;display:block;width:auto;box-shadow:0 8px 18px rgba(26,75,95,.14)}.calculate-btn:hover{transform:translateY(-2px);box-shadow:0 12px 22px rgba(26,75,95,.18);filter:saturate(1.03)}.result-container{margin-top:2rem;padding:1.5rem;background:#fefcf5;border-radius:16px;border:1px solid #ecdca8;border-right:5px solid #6b9e9e;text-align:center;display:none;box-shadow:0 6px 16px rgba(0,0,0,.04)}.result-value{font-size:2rem;font-weight:800;color:#1a3f5c;margin:0.5rem 0}.error-message{color:#ea4335;margin-top:0.5rem;display:none;font-size:0.9rem}.loading{display:none;text-align:center;margin:1rem 0}.spinner{border:4px solid #f3f3f3;border-top:4px solid #1a4b5f;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media(max-width:768px){.calculator{padding:1rem;margin:1rem auto}.calculator-title{font-size:1.2rem}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.5rem;margin:0}.form-group{margin:0}.form-control{padding:0.5rem;font-size:0.9rem}.operation-select-group{margin:0.5rem 0}.operation-select{padding:0.5rem;width:100%}.calculate-btn{padding:0.75rem 1.5rem;margin:0.5rem auto 0;width:auto}.result-value{font-size:1.5rem}}@media(max-width:420px){.calculator{padding:0.75rem}.form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:0.375rem}.form-control{padding:0.375rem;font-size:0.85rem}.operation-select{padding:0.375rem}.calculate-btn{padding:0.625rem 1.25rem;font-size:0.9rem}}