@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap";:root{--coral:#ff6b6b;--teal:#4ecdc4;--gold:#ffe66d;--pink:#ff6b9d;--purple:#9b59b6;--text:#2d3436;--text-muted:#636e72;--bg:#fff9f0}*,:before,:after{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:Plus Jakarta Sans,system-ui,sans-serif}#root{min-height:100vh}.app{min-height:100vh;position:relative;overflow-x:hidden}.bg-shapes{pointer-events:none;z-index:0;position:fixed;inset:0}.shape{filter:blur(80px);opacity:.45;border-radius:50%;position:absolute}.shape-1{background:var(--coral);width:420px;height:420px;top:-120px;right:-80px}.shape-2{background:var(--teal);width:360px;height:360px;bottom:10%;left:-100px}.shape-3{background:var(--gold);width:280px;height:280px;top:40%;right:15%}.header{z-index:1;text-align:center;padding:3rem 1.5rem 2rem;position:relative}.header-badge{background:linear-gradient(135deg, var(--coral), var(--pink));color:#fff;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;margin-bottom:1rem;padding:.35rem .9rem;font-size:.75rem;font-weight:700;display:inline-block}.title{color:var(--text);margin:0 0 .75rem;font-size:clamp(2.2rem,6vw,3.5rem);font-weight:800;line-height:1.1}.title-accent{background:linear-gradient(135deg, var(--coral), var(--teal));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.subtitle{color:var(--text-muted);max-width:480px;margin:0 auto;font-size:1.1rem}.main{z-index:1;max-width:900px;margin:0 auto;padding:0 1.5rem 3rem;position:relative}.panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffbf;border:1px solid #ffffffe6;border-radius:1.25rem;margin-bottom:1.5rem;padding:1.5rem;box-shadow:0 8px 32px #4ecdc41f}.panel-title{color:var(--text);align-items:center;gap:.75rem;margin:0 0 1.25rem;font-size:1.1rem;font-weight:700;display:flex}.step{background:linear-gradient(135deg, var(--teal), var(--coral));color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;font-size:.85rem;font-weight:800;display:inline-flex}.food-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;display:grid}.drink-row{grid-template-columns:repeat(3,1fr);gap:.75rem;display:grid}@media (width<=480px){.drink-row{grid-template-columns:1fr}}.option-card{cursor:pointer;background:#fff;border:2px solid #0000;border-radius:1rem;flex-direction:column;align-items:center;gap:.4rem;padding:1rem .75rem;font-family:inherit;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.option-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000014}.food-card.selected{border-color:var(--teal);background:linear-gradient(135deg,#4ecdc41f,#ff6b6b14);box-shadow:0 4px 16px #4ecdc440}.drink-card.selected{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, white);box-shadow:0 4px 16px color-mix(in srgb, var(--accent) 30%, transparent)}.option-emoji{font-size:2rem;line-height:1}.option-label{color:var(--text);text-align:center;font-size:.85rem;font-weight:600}.action-row{justify-content:center;margin:2rem 0;display:flex}.pair-btn{color:#fff;background:linear-gradient(135deg, var(--coral), var(--pink));cursor:pointer;border:none;border-radius:999px;align-items:center;gap:.6rem;padding:1rem 2.25rem;font-family:inherit;font-size:1.05rem;font-weight:700;transition:transform .15s,box-shadow .15s,opacity .15s;display:inline-flex;box-shadow:0 6px 24px #ff6b6b66}.pair-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 32px #ff6b6b80}.pair-btn:disabled{opacity:.45;cursor:not-allowed}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:1.1rem;height:1.1rem;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result-card{border-left:5px solid var(--purple);background:#fff;border-radius:1.25rem;padding:1.75rem;animation:.4s slideUp;box-shadow:0 12px 40px #9b59b626}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.error-card{border-left-color:var(--coral);background:#fff5f5}.error-title{color:var(--coral);margin:0 0 .25rem;font-weight:700}.result-header{align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.result-emoji{font-size:2.5rem;line-height:1}.result-meta{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 .25rem;font-size:.85rem;font-weight:600}.result-drink{background:linear-gradient(135deg, var(--purple), var(--coral));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.75rem;font-weight:800}.result-description{color:var(--text);margin:0 0 1rem;font-size:1.05rem;line-height:1.65}.result-tip{color:var(--text-muted);background:linear-gradient(135deg,#ffe66d59,#4ecdc426);border-radius:.75rem;margin:0;padding:.85rem 1rem;font-size:.95rem}.result-tip strong{color:var(--teal)}.footer{z-index:1;text-align:center;color:var(--text-muted);padding:1.5rem;font-size:.85rem;position:relative}