/* Gọn đúng ba phần: tên thao tác, một câu nhắc, nút giữ. Vạch nằm trên ly. */
#craft-control{position:absolute;z-index:22;width:224px;padding:9px 11px 11px;background:linear-gradient(110deg,#fff4d9,#efdab4);border:2px solid #91683d;border-radius:8px;box-shadow:2px 3px 0 #68452435,inset 0 0 0 2px #fff2d3;display:flex;flex-direction:column;gap:5px;color:#5d3d24;}
#craft-control small{font-size:12px;letter-spacing:.6px;color:#795531}
#craft-feedback{font-size:17px;line-height:1.25;font-weight:400;min-height:21px}
#craft-hold{touch-action:none;user-select:none;background:linear-gradient(#889b58,#647c3d);border:2px solid #4b602d;border-radius:9px;color:#fff5da;box-shadow:0 3px 0 #3e5026;min-height:51px;font-size:20px;padding:6px 8px;transition:transform .1s,box-shadow .1s}
#craft-hold.holding{transform:translateY(3px);box-shadow:0 1px 0 #3e5026;background:#617a39}
#craft-hold:focus-visible{outline:3px solid #b77e28;outline-offset:4px}
#craft-hold:disabled{opacity:.86}
#craft-syrup-swipe{position:absolute;z-index:24;touch-action:none;user-select:none;cursor:grab;outline:none;background:transparent}
#craft-syrup-swipe[hidden]{display:none!important}
#craft-syrup-swipe.dragging{cursor:grabbing}
#craft-syrup-swipe:focus-visible{outline:2px dashed #aa8150;outline-offset:3px;border-radius:45%}
#craft-syrup-bottle{position:absolute;z-index:25;touch-action:none;user-select:none;cursor:grab;background:transparent;border-radius:25%;-webkit-tap-highlight-color:transparent}
#craft-syrup-bottle[hidden]{display:none!important}
#craft-syrup-bottle.dragging{cursor:grabbing}
#craft-syrup-bottle:focus-visible{outline:2px dashed #799b5d;outline-offset:2px}
#craft-instruction{font-size:13px;line-height:1.25}
#stations .cup-size-choice .cup-size-badge{display:none!important}
#craft-control[data-result=perfect]{border-color:#78863c;background:linear-gradient(120deg,#fff1c5,#edddb0)}
#craft-control[data-craft=steep] #craft-feedback,
#craft-control[data-craft=squeeze] #craft-feedback,
#craft-control[data-craft=pour] #craft-feedback,
#craft-control[data-craft=mix] #craft-feedback,
#craft-control[data-craft=sprinkle] #craft-feedback{font-size:14px;line-height:1.32;font-weight:650}
#craft-control[data-craft=steep] #craft-hold,
#craft-control[data-craft=squeeze] #craft-hold,
#craft-control[data-craft=pour] #craft-hold,
#craft-control[data-craft=mix] #craft-hold,
#craft-control[data-craft=sprinkle] #craft-hold{font-size:17px}
/* A clay teapot is the interaction surface during the coffee minigame.
   No second button or instructional box. Highlight just the real prop. */
#station-coffee.pouring-control{touch-action:none;cursor:grab;-webkit-tap-highlight-color:transparent}
#station-coffee.pouring-control:active{cursor:grabbing}
#station-coffee.pouring-control:focus-visible{outline:2px solid #e3ca83;outline-offset:1px}
#station-coffee.pouring-control .label{display:none}
#station-coffee.pouring-control:before,#station-coffee.pouring-control:after{display:none}
@media(max-height:520px){
  #craft-control{width:224px;padding:8px 10px;gap:4px}
  #craft-hold{min-height:112px;font-size:22px}
  #craft-control small{font-size:13px}
  #craft-feedback{font-size:18px}
  #craft-instruction{font-size:13px}
}