*,:before,:after{box-sizing:border-box}:root{--cheese:#f4c430;--cheese-dark:#c8860a;--italy-red:#c8102e;--italy-green:#008c45;--cream:#fff8e7;--brown:#3d2914;--shadow:0 8px 24px #3d291433;color:var(--brown);background-color:var(--cheese);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5}body{background:radial-gradient(circle at 20% 20%,#ffe566 0%,#0000 40%),radial-gradient(circle at 80% 80%,#e8b020 0%,#0000 35%),repeating-linear-gradient(45deg,#f4c430 0 20px,#e8b020 20px 40px);min-height:100vh;margin:0}#app{min-height:100vh}.page{max-width:900px;margin:0 auto;padding:2rem 1.25rem 3rem}.hero-header{text-align:center;margin-bottom:2rem}.hero-header h1{text-transform:uppercase;color:var(--brown);text-shadow:3px 3px 0 #fff, -1px -1px 0 var(--italy-red);margin:0 0 .75rem;font-family:Impact,Arial Black,sans-serif;font-size:clamp(2rem,6vw,3.2rem);line-height:1.1}.subtitle{margin:0;max-width:36rem;margin-inline:auto;font-size:1.05rem}.card{background:var(--cream);border:4px solid var(--brown);box-shadow:var(--shadow);border-radius:1rem}.form-card{max-width:420px;margin:0 auto;padding:1.5rem}.birth-form{flex-direction:column;gap:1rem;display:flex}.birth-form label{font-size:1.1rem;font-weight:700}.birth-form input[type=date]{border:3px solid var(--brown);background:#fff;border-radius:.5rem;padding:.75rem 1rem;font-size:1rem}.btn-primary,.btn-secondary{cursor:pointer;text-transform:uppercase;letter-spacing:.03em;border:3px solid var(--brown);border-radius:.5rem;padding:.85rem 1.25rem;font-size:1rem;font-weight:800;transition:transform .15s,background .15s}.btn-primary{background:var(--italy-red);color:#fff}.btn-primary:hover,.btn-secondary:hover{transform:scale(1.03)}.btn-secondary{color:var(--brown);background:#fff;margin-top:1.5rem}.form-error{color:var(--italy-red);text-align:center;margin:1rem 0 0;font-weight:700}.loader-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#3d2914d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loader-overlay[hidden]{display:none}.loader-content{text-align:center;color:#fff;width:100%;max-width:420px;padding:2rem 1.5rem}.milking-scene{height:280px;margin-bottom:1.25rem;position:relative}.cow-wrapper{transform-origin:bottom;z-index:2;width:280px;position:absolute;top:0;left:50%;transform:translate(-50%)}.cow-svg{filter:drop-shadow(0 6px 12px #00000059);width:100%;height:auto}.milk-stream{transform-origin:top;z-index:1;background:linear-gradient(#fff 0%,#f5f5f5 100%);border-radius:0 0 5px 5px;width:8px;height:60px;margin-left:-4px;position:absolute;top:176px;left:calc(50% - 13px);box-shadow:0 0 6px #fff9}.milk-drops{z-index:1;pointer-events:none;width:40px;height:60px;position:absolute;top:176px;left:calc(50% - 13px);transform:translate(-50%)}.milk-drop-particle{opacity:0;background:#fff;border-radius:50%/60% 60% 40% 40%;width:8px;height:12px;position:absolute;top:0;box-shadow:0 0 4px #fff9}.milk-drop-particle:first-child{left:42%}.milk-drop-particle:nth-child(2){left:48%}.milk-drop-particle:nth-child(3){left:54%}.milk-drop-particle:nth-child(4){left:45%}.milk-drop-particle:nth-child(5){left:51%}@keyframes cowShake{0%,to{transform:translate(-50%)rotate(0)}25%{transform:translate(calc(8px - 50%))rotate(5deg)}75%{transform:translate(calc(-50% - 8px))rotate(-5deg)}}@keyframes armPump{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}@keyframes milkStreamFlow{0%{opacity:0;transform:scaleY(0)}10%{opacity:1;transform:scaleY(1)}90%{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(.2)}}@keyframes bucketFillUp{0%{height:0%}to{height:92%}}@keyframes milkDropFall{0%{opacity:0;transform:translateY(0)}20%{opacity:1}to{opacity:0;transform:translateY(70px)}}.loader-overlay.is-active .cow-wrapper{animation:.18s ease-in-out infinite cowShake}.loader-overlay.is-active .milker-arm{transform-origin:50%;transform-box:fill-box;animation:.2s ease-in-out infinite armPump}.loader-overlay.is-active .milk-stream{animation:3s ease-in-out forwards milkStreamFlow}.loader-overlay.is-active .milk-bucket-fill{animation:3s ease-in-out forwards bucketFillUp}.loader-overlay.is-active .milk-drop-particle{animation:.5s ease-in infinite milkDropFall}.loader-overlay.is-active .milk-drop-particle:first-child{animation-delay:.2s}.loader-overlay.is-active .milk-drop-particle:nth-child(2){animation-delay:.35s}.loader-overlay.is-active .milk-drop-particle:nth-child(3){animation-delay:.5s}.loader-overlay.is-active .milk-drop-particle:nth-child(4){animation-delay:.65s}.loader-overlay.is-active .milk-drop-particle:nth-child(5){animation-delay:.8s}.milk-bucket{z-index:3;width:100px;height:90px;position:absolute;bottom:0;left:calc(50% - 13px);transform:translate(-50%)}.milk-bucket-body{clip-path:polygon(8% 0%,92% 0%,100% 100%,0% 100%);background:linear-gradient(silver 0%,#888 100%);border:3px solid #fff;border-radius:0 0 12px 12px;width:100%;height:75px;position:absolute;bottom:0;left:0}.milk-bucket-rim{z-index:2;background:#aaa;border:3px solid #fff;border-radius:4px;width:calc(100% + 8px);height:14px;position:absolute;top:0;left:-4px}.milk-bucket-fill{z-index:1;background:linear-gradient(#fff 0%,#e8e8e8 100%);border-radius:0 0 8px 8px;width:calc(100% - 12px);height:0%;position:absolute;bottom:3px;left:6px;overflow:hidden}.loader-message{text-transform:uppercase;margin:0 0 .5rem;font-family:Impact,Arial Black,sans-serif;font-size:1.5rem}.loader-hint{opacity:.85;margin:0;font-size:.95rem}.result-section{isolation:isolate;position:relative}.result-section[hidden]{display:none}.cheese-rain{pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.cheese-rain[hidden]{display:none}@keyframes cheeseFall{0%{transform:translateY(-100px)rotate(0)}to{transform:translateY(105vh) rotate(var(--spin,540deg))}}.falling-wheel{animation:1.8s linear forwards cheeseFall;position:absolute;top:0}.result-content{z-index:5;opacity:0;text-align:center;background:var(--cream);border:4px solid var(--brown);box-shadow:var(--shadow);border-radius:1rem;padding:2rem 1.5rem;transition:opacity .4s,transform .4s;position:relative;transform:translateY(20px)}@keyframes resultReveal{0%{opacity:0;transform:translateY(24px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.result-reveal{opacity:0;animation:.5s forwards resultReveal}@keyframes btnShake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.btn-shake{animation:.4s btnShake}.result-section.is-visible .result-content{opacity:1;transform:translateY(0)}.baby-message{color:var(--italy-green);margin:0 0 1rem;font-size:1.1rem;font-weight:700}.result-hero{text-transform:uppercase;color:var(--italy-red);text-shadow:2px 2px #fff;margin:0 0 1rem;font-family:Impact,Arial Black,sans-serif;font-size:clamp(1.5rem,5vw,2.4rem);line-height:1.15}.result-milk{margin:0 0 .5rem;font-size:1.15rem;font-weight:600}.result-extra{opacity:.8;margin:0 0 1.5rem;font-size:.9rem}.aging-grid{grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem;display:grid}.aging-card{border:3px solid var(--brown);font:inherit;color:inherit;text-align:center;cursor:pointer;background:#fff;border-radius:.75rem;padding:1rem .5rem;transition:transform .15s,box-shadow .15s}.aging-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}.aging-card--highlight{background:var(--cheese);border-color:var(--italy-red);box-shadow:var(--shadow);transform:scale(1.05)}.aging-card--highlight:hover{transform:scale(1.05)translateY(-3px)}.aging-milk{color:var(--brown);background:var(--cream);border:2px dashed var(--cheese-dark);border-radius:.5rem;margin:.6rem 0 0;padding:.5rem .4rem;font-size:.85rem;font-weight:700}.aging-hint{text-transform:uppercase;letter-spacing:.04em;opacity:.55;margin:.5rem 0 0;font-size:.72rem;font-weight:600}.aging-card--open .aging-hint{display:none}.aging-card h3{text-transform:uppercase;margin:0 0 .5rem;font-size:1rem}.aging-count{color:var(--italy-red);margin:0;font-family:Impact,Arial Black,sans-serif;font-size:clamp(1.8rem,5vw,2.5rem);line-height:1}.aging-label{margin:.25rem 0 0;font-size:.9rem;font-weight:600}.falling-wheel svg{filter:drop-shadow(0 6px 10px #00000059);width:100%;height:100%}@media (width<=600px){.milking-scene{height:240px}.cow-wrapper{width:230px}.milk-stream,.milk-drops{top:146px;left:calc(50% - 11px)}.milk-stream{height:55px}.aging-grid{grid-template-columns:1fr}.aging-card--highlight{transform:none}.page{padding-top:1.25rem}}
