:root{--color-primary: #87CEEB;--color-primary-dark: #6BB6D9;--color-success: #A8E6CF;--color-warning: #FFD97D;--color-danger: #FFB6B9;--color-text: #4A5568;--color-text-light: #9CA3AF;--color-border: #E8D5E0;--color-bg: #FFFFFF;--color-bg-alt: #FFF8F0;--color-bottle-bg: #F0F8FF;--color-formula: rgba(255, 248, 240, .7);--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--border-radius: 1rem;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);color:var(--color-text);background:#e8f4f8;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;position:relative}body:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300"><defs><radialGradient id="bubble1"><stop offset="0%25" stop-color="%23ffffff" stop-opacity="0.5"/><stop offset="20%25" stop-color="%23FFE6F0" stop-opacity="0.15"/><stop offset="40%25" stop-color="%23E8D5FF" stop-opacity="0.12"/><stop offset="60%25" stop-color="%23D5F0FF" stop-opacity="0.1"/><stop offset="80%25" stop-color="%23FFE6F0" stop-opacity="0.08"/><stop offset="100%25" stop-color="%23E8D5FF" stop-opacity="0.03"/></radialGradient><radialGradient id="bubble2"><stop offset="0%25" stop-color="%23ffffff" stop-opacity="0.5"/><stop offset="20%25" stop-color="%23D5F0FF" stop-opacity="0.15"/><stop offset="40%25" stop-color="%23FFE6F0" stop-opacity="0.12"/><stop offset="60%25" stop-color="%23E8D5FF" stop-opacity="0.1"/><stop offset="80%25" stop-color="%23D5F0FF" stop-opacity="0.08"/><stop offset="100%25" stop-color="%23FFE6F0" stop-opacity="0.03"/></radialGradient><radialGradient id="shine"><stop offset="0%25" stop-color="%23ffffff" stop-opacity="0.7"/><stop offset="50%25" stop-color="%23ffffff" stop-opacity="0.3"/><stop offset="100%25" stop-color="%23ffffff" stop-opacity="0"/></radialGradient></defs><circle cx="40" cy="50" r="35" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="30" cy="35" rx="12" ry="18" fill="url(%23shine)"/><circle cx="100" cy="100" r="28" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="93" cy="88" rx="10" ry="14" fill="url(%23shine)"/><circle cx="200" cy="60" r="42" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="188" cy="45" rx="14" ry="20" fill="url(%23shine)"/><circle cx="260" cy="140" r="32" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="252" cy="128" rx="11" ry="16" fill="url(%23shine)"/><circle cx="60" cy="180" r="38" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="48" cy="165" rx="13" ry="19" fill="url(%23shine)"/><circle cx="160" cy="200" r="45" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="147" cy="182" rx="15" ry="22" fill="url(%23shine)"/><circle cx="240" cy="240" r="36" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="230" cy="226" rx="12" ry="18" fill="url(%23shine)"/><circle cx="140" cy="30" r="25" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="134" cy="22" rx="9" ry="12" fill="url(%23shine)"/><circle cx="20" cy="140" r="30" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="13" cy="130" rx="10" ry="15" fill="url(%23shine)"/><circle cx="180" cy="130" r="26" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="174" cy="121" rx="9" ry="13" fill="url(%23shine)"/><circle cx="90" cy="260" r="33" fill="url(%23bubble1)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="82" cy="248" rx="11" ry="16" fill="url(%23shine)"/><circle cx="280" cy="80" r="29" fill="url(%23bubble2)" stroke="%23ffffff" stroke-width="1" stroke-opacity="0.3"/><ellipse cx="273" cy="71" rx="10" ry="14" fill="url(%23shine)"/></svg>');background-size:300px 300px;animation:floatPattern 50s linear infinite;pointer-events:none;z-index:0;min-height:100%}@keyframes floatPattern{0%{background-position:0 0}to{background-position:200px 200px}}body>*{position:relative;z-index:1}button{font-family:inherit;cursor:pointer}input,textarea{font-family:inherit}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}code{font-family:Courier New,Courier,monospace;background-color:var(--color-bg-alt);padding:.125rem .25rem;border-radius:.25rem;font-size:.875em}.container{max-width:1200px;margin:0 auto;padding:var(--spacing-lg);padding-bottom:var(--spacing-sm)}.header{background:linear-gradient(135deg,#ffb6d9,#c5cae9,#b3e5fc);border-bottom:none;padding:var(--spacing-md) 0;margin-bottom:var(--spacing-xl);box-shadow:0 2px 12px #00000014,0 6px 30px #b3e5fc26;position:relative;overflow:hidden}.header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="10" cy="10" r="2" fill="white" opacity="0.3"/><circle cx="30" cy="25" r="1.5" fill="white" opacity="0.3"/><circle cx="50" cy="15" r="2.5" fill="white" opacity="0.3"/><circle cx="70" cy="30" r="1" fill="white" opacity="0.3"/><circle cx="85" cy="20" r="2" fill="white" opacity="0.3"/></svg>');background-size:100px 100px;animation:float 20s linear infinite}@keyframes float{0%{background-position:0 0}to{background-position:100px 100px}}.header h1{font-size:2.25rem;font-weight:800;color:#fff;margin-bottom:var(--spacing-sm);text-shadow:3px 3px 6px rgba(0,0,0,.3),0 0 20px rgba(255,255,255,.3),0 0 30px rgba(255,182,217,.4);position:relative;z-index:1;letter-spacing:-.5px}.header p{color:#fffffffa;font-size:1.1rem;position:relative;z-index:1;text-shadow:2px 2px 4px rgba(0,0,0,.3),0 0 15px rgba(255,255,255,.2);font-weight:500}.header-content{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg);position:relative;z-index:1}.header-text{flex:1}.tip-buttons{display:flex;flex-direction:column;gap:var(--spacing-sm)}.tip-button{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;background:#fffffff2;color:#374151;font-weight:600;font-size:.9375rem;border-radius:50px;text-decoration:none;box-shadow:0 2px 8px #0000001a;transition:all .3s ease;white-space:nowrap;border:4px solid transparent;background-clip:padding-box;position:relative}.tip-button:before{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50px;padding:4px;background:linear-gradient(135deg,#ffb6d9,#e6b3ff,#b3e5fc,#ffc9e3,#fff,#d8a7d8,#ffb6d9);background-size:400% 400%;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:gradientShift 6s linear infinite;z-index:-1}@keyframes gradientShift{0%{background-position:0% 50%}to{background-position:-400% 50%}}.tip-button span{display:inline-flex;align-items:center;line-height:1}.tip-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;background:#fff;border-color:#374151}.tip-button:active{transform:translateY(0)}@media (max-width: 768px){.header-content{flex-direction:column;align-items:stretch}.tip-buttons{flex-direction:row;justify-content:center}}.bottle-container{position:relative;width:min(600px,92vw);margin:var(--spacing-lg) auto;display:flex;flex-direction:column;align-items:stretch;min-height:720px;overflow:visible;transition:all .6s cubic-bezier(.4,0,.2,1)}.baby-bottle-svg{position:absolute;top:-7%;left:0;width:100%;height:114%;z-index:0;pointer-events:none;overflow:visible;transition:all .6s cubic-bezier(.4,0,.2,1)}.baby-bottle-svg *{transition:all .6s cubic-bezier(.4,0,.2,1)}.search-form{position:relative;z-index:1;width:100%;padding:52% 16% 12%;background:transparent;border:none;box-shadow:none;min-height:700px;display:flex;flex-direction:column;justify-content:flex-start;transition:padding .6s cubic-bezier(.4,0,.2,1)}.search-form .form-group{background:#ffffffbf;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:var(--spacing-md);border-radius:calc(var(--border-radius) / 2);margin-bottom:var(--spacing-lg);box-shadow:0 2px 10px #0000000d;border:1px solid rgba(255,255,255,.5);transition:all .3s ease}.search-form .form-group label{display:block;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-text);font-size:.9rem}.search-form .form-group input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:2px solid rgba(232,213,224,.4);border-radius:calc(var(--border-radius) / 2);font-size:.95rem;background-color:#ffffffe6;transition:all .3s ease}.search-form .form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #87ceeb33;background-color:#fff}.search-form .form-group small{display:block;margin-top:var(--spacing-xs);color:var(--color-text-light);font-size:.8rem}.search-form .btn{width:100%;margin-top:var(--spacing-md)}@media (max-width: 768px){.bottle-container{width:95vw;min-height:750px}.search-form{padding:30% 14% 10%;min-height:650px}.search-form .form-group{padding:var(--spacing-sm)}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-text);font-size:.95rem}.form-group input{width:100%;padding:var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--border-radius);font-size:1rem;background-color:#ffffffe6;transition:all .3s ease}.form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 4px #87ceeb33;background-color:#fff}.form-group small{display:block;margin-top:var(--spacing-sm);color:var(--color-text-light);font-size:.85rem}.btn{padding:calc(var(--spacing-md) + 2px) var(--spacing-xl);border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:700;transition:all .3s ease;box-shadow:0 4px 10px #0000001a}.btn-primary{background:linear-gradient(135deg,#87ceeb,#b3e5fc);color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#6bb6d9,#81d4fa);transform:translateY(-2px);box-shadow:0 6px 15px #87ceeb4d}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:linear-gradient(135deg,#ffd97d,#ffe4a0);color:var(--color-text);border:2px solid var(--color-border)}.btn-secondary:hover{background:linear-gradient(135deg,#ffc857,#ffd97d);transform:translateY(-2px);box-shadow:0 6px 15px #ffd97d4d}.autocomplete-container{position:relative;display:inline-block;width:100%}.autocomplete-suggestions{position:absolute;top:100%;left:0;right:0;max-height:240px;overflow-y:auto;background:#fffffffa;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:2px solid var(--color-primary);border-top:none;border-radius:0 0 calc(var(--border-radius) / 2) calc(var(--border-radius) / 2);box-shadow:0 6px 16px #0000001f;z-index:1000;margin-top:-2px}.autocomplete-suggestion{padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;transition:background-color .2s}.autocomplete-suggestion:hover,.autocomplete-suggestion.highlighted{background-color:#87ceeb33}.autocomplete-suggestion.highlighted{font-weight:600}.autocomplete-preview-container{position:relative}.autocomplete-preview{position:absolute;top:0;left:0;right:0;bottom:0;padding:calc(.75rem + 4px) var(--spacing-md);pointer-events:none;color:#999;white-space:nowrap;overflow:hidden}.autocomplete-preview-typed{opacity:0}.loading{text-align:center;padding:var(--spacing-xl);color:var(--color-text-light)}.error{background-color:#fee;border:1px solid var(--color-danger);color:var(--color-danger);padding:var(--spacing-lg);border-radius:var(--border-radius);margin-top:4rem;margin-bottom:var(--spacing-lg)}.results{margin-top:var(--spacing-xxl);margin-bottom:var(--spacing-xl);padding-top:var(--spacing-xl)}.results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg);flex-wrap:wrap;gap:var(--spacing-md)}.results-header h2{font-size:1.5rem;font-weight:700}.results-count{color:var(--color-text-light);font-size:.875rem}.share-button{display:inline-flex;align-items:center;gap:var(--spacing-sm)}.no-results{background:linear-gradient(to bottom right,#fffffff2,#a8e6cf33);padding:var(--spacing-xl);border-radius:var(--border-radius);text-align:center;border:2px solid rgba(168,230,207,.4);box-shadow:0 4px 15px #a8e6cf33;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.no-results h3{font-size:1.5rem;margin-bottom:var(--spacing-md);color:#059669;text-shadow:1px 1px 2px rgba(168,230,207,.3)}.search-summary-box{margin-top:var(--spacing-lg);padding:var(--spacing-lg);background:#fffc;border-radius:var(--border-radius);border:1px solid rgba(168,230,207,.3);text-align:left;box-shadow:0 2px 8px #0000000d}.search-summary-title{font-weight:600;margin-bottom:var(--spacing-sm);color:#059669;font-size:.9375rem}.search-summary-list{margin:0;padding-left:1.5rem;font-size:.875rem;line-height:1.8;color:var(--color-text)}.search-summary-list li{margin-bottom:.25rem}.search-summary-timestamp{margin-top:var(--spacing-md);padding-top:var(--spacing-sm);border-top:1px solid rgba(168,230,207,.3);font-size:.8125rem;color:var(--color-text-light)}.recall-card{background:linear-gradient(to bottom right,#fffffff2,#fff8f0f2);padding:var(--spacing-lg);border-radius:var(--border-radius);box-shadow:0 4px 15px #00000014;margin-bottom:var(--spacing-lg);border:2px solid rgba(232,213,224,.3);border-left:5px solid var(--color-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.recall-card.confidence-strong{border-left-color:var(--color-danger);box-shadow:0 4px 15px #ffb6b94d}.recall-card.confidence-likely{border-left-color:var(--color-warning);box-shadow:0 4px 15px #ffd97d4d}.recall-card.confidence-possible{border-left-color:var(--color-text-light);box-shadow:0 4px 15px #9ca3af33}.recall-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:var(--spacing-md);gap:var(--spacing-md);flex-wrap:wrap}.confidence-badge{padding:calc(var(--spacing-xs) + 2px) calc(var(--spacing-md) + 2px);border-radius:9999px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px #0000001a}.confidence-badge.strong{background:linear-gradient(135deg,#ffb6b9,#ffc9cb);color:#b91c1c}.confidence-badge.likely{background:linear-gradient(135deg,#ffd97d,#ffe4a0);color:#b45309}.confidence-badge.possible{background:linear-gradient(135deg,#e5e7eb,#f3f4f6);color:var(--color-text-light)}.recall-title{font-size:1.125rem;font-weight:600;margin-bottom:var(--spacing-sm)}.recall-firm{color:var(--color-text-light);font-size:.875rem;margin-bottom:var(--spacing-md)}.recall-details{display:grid;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.detail-row{display:grid;grid-template-columns:150px 1fr;gap:var(--spacing-md)}.detail-label{font-weight:600;color:var(--color-text)}.detail-value{color:var(--color-text-light)}.code-info{background-color:var(--color-bg-alt);padding:var(--spacing-md);border-radius:var(--border-radius);font-family:Courier New,Courier,monospace;font-size:.875rem;margin-top:var(--spacing-md);border:1px solid var(--color-border);white-space:pre-wrap;word-break:break-word}.classification{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius);font-size:.875rem;font-weight:600;background-color:var(--color-bg-alt)}.disclaimer{background-color:var(--color-bg);padding:var(--spacing-lg);border-radius:var(--border-radius);border:1px solid var(--color-border);margin-bottom:var(--spacing-xl)}.disclaimer h3{font-size:1rem;font-weight:700;margin-bottom:var(--spacing-md)}.disclaimer p{color:var(--color-text-light);font-size:.875rem;line-height:1.6;margin-bottom:var(--spacing-sm)}.disclaimer a{font-weight:600}.footer{text-align:center;padding:var(--spacing-md) 0;color:#64748b;font-size:.875rem;background:#f8fafc;border-top:1px solid #e2e8f0;margin-top:var(--spacing-sm)}.footer a{color:#475569;font-weight:600}.footer a:hover{color:#334155}@media (max-width: 768px){.detail-row{grid-template-columns:1fr;gap:var(--spacing-sm)}.results-header{flex-direction:column;align-items:flex-start}}
