.calculator-container{max-width:100%;width:100%;margin:0 auto;padding:2rem 1.5rem;background:linear-gradient(135deg,#fff,#f8fafc);border-radius:2rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a,0 0 0 1px #ffffff80 inset,0 0 60px #6366f114;border:2px solid rgba(255,255,255,.8);backdrop-filter:blur(10px);position:relative;overflow:hidden}.calculator-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea,#764ba2,#f093fb,#4facfe);background-size:200% 100%;animation:shimmer 3s ease-in-out infinite}@keyframes shimmer{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@media(min-width:768px){.calculator-container{max-width:850px;padding:2.5rem;margin:0 auto}}.logo-text{text-align:center;font-size:1.1rem;font-weight:600;color:#6b7280;margin-bottom:.5rem;letter-spacing:.05em}.intro-text{text-align:center;color:#4b5563;margin-bottom:1.5rem;font-size:.95rem;line-height:1.6}.result-box{margin-top:1.5rem;padding:1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:1.25rem;text-align:center;font-size:1.5rem;font-weight:700;color:#fff;min-height:80px;display:flex;align-items:center;justify-content:center;transition:all .3s ease-in-out;box-shadow:0 10px 25px -5px #667eea66,0 0 20px #667eea33 inset;transform:translateY(0);position:relative;overflow:hidden}.result-box:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.2) 0%,transparent 70%);animation:pulse 3s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(.8);opacity:.5}50%{transform:scale(1.2);opacity:.8}}.result-box:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 15px 35px -5px #667eea80,0 0 30px #667eea4d inset}.explanation-box{margin-top:1rem;padding:1.5rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px solid #fbbf24;border-radius:1.25rem;text-align:center;font-size:1rem;color:#78350f;min-height:60px;line-height:1.7;transition:all .3s ease-in-out;box-shadow:0 4px 15px -3px #fbbf244d,0 0 10px #fbbf241a inset}.explanation-box p{margin-bottom:.75rem}.explanation-box p:last-child{margin-bottom:0}label{display:block;margin-bottom:.5rem;font-weight:600;color:#374151}input[type=number]{width:100%;padding:1rem 1.25rem;border:2px solid #e5e7eb;border-radius:1rem;margin-bottom:1.25rem;background:linear-gradient(135deg,#fff,#f9fafb);box-shadow:0 2px 8px #0000000d,inset 0 1px 2px #00000005;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:1rem;font-weight:500;color:#1f2937}input[type=number]:hover{border-color:#a78bfa;box-shadow:0 4px 12px #a78bfa26,inset 0 1px 2px #00000005;transform:translateY(-2px)}input[type=number]:focus{outline:none;border-color:#667eea;background:#fff;box-shadow:0 0 0 4px #667eea26,0 4px 16px #667eea33,inset 0 1px 2px #00000005;transform:translateY(-2px)}.calculator-container button:not(.accordion-header):not(.item-button){width:100%;padding:1.1rem 1.5rem;font-size:1.1rem;color:#fff;font-weight:600;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s ease-out;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;margin-top:.5rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.calculator-container button#calculateBtn{background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);background-size:200% 200%;animation:gradientShift 3s ease infinite;position:relative;overflow:hidden}.calculator-container button#calculateBtn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.calculator-container button#calculateBtn:hover:before{left:100%}.calculator-container button#calculateBtn:hover{background-position:right center;box-shadow:0 15px 35px -5px #667eea80,0 0 20px #764ba266;transform:translateY(-4px) scale(1.05)}.calculator-container button#calculateBtn:active{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 20px -5px #667eea66,0 0 15px #764ba24d}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.calculator-container button#calculateFoodBurnOffBtn{background-image:linear-gradient(to right,#10b981,#34d399)}.calculator-container button#calculateFoodBurnOffBtn:hover{background-image:linear-gradient(to right,#059669,#10b981);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;transform:translateY(-2px) scale(1.02)}.calculator-container button#calculateFoodBurnOffBtn:active{transform:translateY(0) scale(.98);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.error-message{color:#dc2626;font-size:.875rem;font-weight:500;margin-top:1rem;margin-bottom:1rem;min-height:1.25rem;text-align:center}.calculator-layout{display:flex;flex-direction:column;gap:2rem}@media(min-width:768px){.calculator-layout{flex-direction:row}.layout-left,.layout-right{flex:1;min-width:0}}.layout-right{display:flex;flex-direction:column}.accordion-container{border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden}.accordion-section:not(:last-child){border-bottom:1px solid #e5e7eb}.accordion-header{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:none;width:100%;text-align:left;padding:1.25rem 1.5rem;font-size:1rem;font-weight:600;color:#374151;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;justify-content:space-between;align-items:center;border-radius:.75rem;margin-bottom:.5rem}.accordion-header:hover{background:linear-gradient(135deg,#e0e7ff,#ddd6fe);color:#6366f1;transform:translate(4px);box-shadow:0 4px 12px #6366f126}.accordion-header .indicator:before{content:"+";font-size:1.2rem;font-weight:700;color:#9ca3af;transition:transform .3s ease;display:inline-block}.accordion-header.active .indicator:before{transform:rotate(45deg);color:#0ea5e9}.accordion-content{padding:0;background-color:#fff;max-height:0;overflow:hidden;transition:max-height .3s ease-out,padding .3s ease-out}.accordion-content.active{max-height:500px;padding:1rem}.item-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem}.item-button{background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #e5e7eb;border-radius:1rem;padding:.875rem 1rem;font-size:.875rem;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);color:#374151;font-weight:500;box-shadow:0 2px 8px #0000000d;position:relative;overflow:hidden}.item-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#667eea1a;transform:translate(-50%,-50%);transition:width .3s,height .3s}.item-button:hover{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-color:#667eea;transform:translateY(-3px);box-shadow:0 8px 20px #667eea33,0 0 0 3px #667eea1a}.item-button:hover:before{width:200%;height:200%}.item-button.selected{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:#764ba2;font-weight:600;box-shadow:0 8px 25px #667eea66,0 0 0 3px #667eea33,inset 0 2px 4px #fff3;transform:translateY(-2px) scale(1.02)}.item-button.selected:before{background:#fff3}.item-button.food-selected{background-color:#10b981;border-color:#10b981;box-shadow:0 0 0 2px #10b9814d}.item-button.food-selected:hover{background-color:#059669;border-color:#047857}.emoji{margin-right:.5rem;font-size:1.1em}.explanation-highlight{font-weight:600;color:#0ea5e9}.section-divider{border-top:2px dashed #d1d5db;margin:3rem 0}.section-title{font-size:1.5rem;font-weight:700;text-align:center;margin-bottom:1.5rem;color:#1f2937}.food-calorie-display{text-align:center;margin-top:-.5rem;margin-bottom:1rem;font-size:.9rem;color:#4b5563;min-height:1.25rem}.food-calorie-display span{font-weight:600}.food-burn-off-result{margin-top:1.5rem;padding:1.25rem;background-color:#f0fdf4;border:1px solid #bbf7d0;border-radius:.75rem;text-align:center;font-size:1.1rem;font-weight:500;color:#15803d;min-height:60px;transition:all .3s ease-in-out}