/* annona.co.uk - Taste Lab (flavour mixer + squeeze test) exhibit (Task 13) */
.taste-lab{display:grid;gap:2rem}
.taste-lab h3{margin:0 0 .5rem;font-family:var(--font-display);font-size:1.4rem;color:var(--green-900)}
.taste-lab section>p{margin:.25rem 0 .75rem;max-width:60ch}

/* ---------- Flavour Mixer ---------- */
.mix-sliders{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1.5rem;margin:.75rem 0 1rem}
.mix-row{display:grid;gap:.15rem}
.mix-label{display:flex;align-items:center;gap:.5rem;font-weight:700}
.mix-emoji{font-size:1.5rem;line-height:1}
.mix-value{margin-left:auto;min-width:2ch;text-align:right;font-variant-numeric:tabular-nums;color:var(--green-900)}
.mix-slider{-webkit-appearance:none;appearance:none;width:100%;height:48px;margin:0;background:transparent;cursor:pointer}
.mix-slider::-webkit-slider-runnable-track{height:12px;border-radius:999px;background:var(--custard);box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}
.mix-slider::-moz-range-track{height:12px;border-radius:999px;background:var(--custard);box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}
.mix-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:48px;height:48px;margin-top:-18px;border-radius:50%;border:4px solid var(--paper);background:var(--green-600);box-shadow:0 3px 8px rgba(20,40,20,.3)}
.mix-slider::-moz-range-thumb{width:40px;height:40px;border-radius:50%;border:4px solid var(--paper);background:var(--green-600);box-shadow:0 3px 8px rgba(20,40,20,.3)}
.mix-slider:focus-visible{outline:3px solid var(--seed);outline-offset:3px;box-shadow:none}

.mix-readout{font-weight:800;font-size:1.2em;margin:.5rem 0 .25rem}
.mix-cousin{margin:0 0 1rem;padding:.5rem .9rem;border-radius:12px;border-left:10px solid var(--cousin-colour,var(--green-600));background:color-mix(in srgb,var(--cousin-colour,var(--green-600)) 18%,var(--paper))}
.mix-cousin-name{color:var(--green-900)}

.mix-presets{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 1rem}
.mix-presets-label{font-weight:800;margin-right:.25rem}
.preset-btn{padding:.5rem .9rem}
.taste-btn{background:var(--accent);color:var(--seed);font-size:1.1em}
.taste-result{margin-top:1rem;padding:1rem 1.1rem;border-radius:var(--radius);border-left:10px solid var(--cousin-colour,var(--green-600));background:color-mix(in srgb,var(--cousin-colour,var(--green-600)) 16%,var(--paper))}
.taste-result p{margin:0 0 .5rem;max-width:60ch}
.taste-result p:last-child{margin-bottom:0}
.taste-result-title{font-weight:800;font-size:1.15em}

/* ---------- Squeeze Test ---------- */
.squeeze-row{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:flex-end;justify-content:center;padding:.5rem 0 1rem}
.squeeze-fruit{position:relative;width:8rem;height:8rem;padding:0;border:0;background:transparent;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;transition:transform .15s;transform-origin:bottom center;border-radius:50%}
.squeeze-fruit svg{width:100%;height:100%;display:block;filter:drop-shadow(0 6px 6px rgba(20,40,20,.25))}
.squeeze-fruit.is-pressing{transform:scale(var(--sx,1),var(--sy,1))}
.squeeze-fruit.is-chosen svg{filter:drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 6px var(--accent))}
.squeeze-fruit.is-ripe svg{filter:drop-shadow(0 0 8px var(--green-600))}
.squeeze-num{position:absolute;left:50%;bottom:-.25rem;transform:translateX(-50%);min-width:2rem;padding:.1rem .5rem;border-radius:999px;background:var(--green-900);color:#fff;font-weight:800;font-size:1.1rem;line-height:1.5;pointer-events:none}
.squeeze-feedback{font-weight:800;font-size:1.1em;min-height:1.5em;margin:0 0 .5rem}
.squeeze-feedback[data-result="ripe"]{color:var(--green-900)}
.squeeze-feedback[data-result="hard"],.squeeze-feedback[data-result="over"]{color:#8a3b12}
.squeeze-tip{padding:.6rem .9rem;border-radius:12px;background:#f1f6ec;border-left:6px solid var(--green-300)}

/* ---------- narrow screens ---------- */
@media (max-width:560px){
  .mix-sliders{grid-template-columns:minmax(0,1fr)}
  .squeeze-row{gap:.75rem}
  .squeeze-fruit{width:6rem;height:6rem}
}