/* Dairy Ranch (shared: sim3d.css + tycoon-kit.css) */
.dr-tag { position: absolute; left: 0; top: 0; pointer-events: none; background: rgba(255, 255, 255, .92); color: #111827; border-radius: 9px; padding: 2px 7px; font: 800 11px system-ui, sans-serif; white-space: nowrap; will-change: transform; box-shadow: 0 2px 6px rgba(0, 0, 0, .3); }
.dr-tag.is-need { background: #fef3c7; animation: dr-bob .8s ease-in-out infinite alternate; }
.dr-tag.is-sel { outline: 3px solid #facc15; }
@keyframes dr-bob { to { margin-top: -4px; } }
.dr-panel { width: min(300px, calc(100% - 20px)); }
.dr-panel h5 small { font-weight: 600; opacity: .75; }
.dr-bar { display: grid; grid-template-columns: 88px 1fr; align-items: center; gap: 6px; margin-bottom: 4px; font-size: 12px; }
.dr-bar i { height: 9px; border-radius: 5px; background: rgba(255, 255, 255, .15); overflow: hidden; }
.dr-bar u { display: block; height: 100%; }
.dr-panel .tk-row { margin-top: 6px; }
.dr-milk { top: auto; bottom: 10px; right: auto; left: 50%; transform: translateX(-50%) !important; width: min(340px, calc(100% - 20px)); text-align: center; }
.dr-milk:not(.is-on) { transform: translate(-50%, 12px) !important; }
.dr-bucket { position: relative; margin: 4px auto 6px; width: 70px; height: 70px; border: 3px solid #cbd5e1; border-top: 0; border-radius: 0 0 16px 16px; overflow: hidden; background: rgba(255, 255, 255, .06); }
.dr-bucket u { position: absolute; left: 0; right: 0; bottom: 0; background: #f8fafc; transition: height .12s; }
.dr-bucket span { position: relative; display: block; line-height: 70px; font: 900 14px system-ui, sans-serif; color: #0f172a; text-shadow: 0 0 4px #fff; }
.dr-combo { font-weight: 800; margin-bottom: 6px; }
.dr-squeeze { justify-content: center; }
.dr-squeeze button { flex: 1; min-height: 54px !important; font-size: 16px !important; touch-action: manipulation; }
.dr-herd button.is-on { border-color: #facc15; }
.tk-list > button { align-items: center; }
.tk-list > button span small { font-weight: 600; opacity: .75; }
.tk-list > button b { color: #fde047; flex: 0 0 auto; }
.tk-hud .dr-water.is-alert { background: rgba(185, 28, 28, .85); animation: none; }
@container (max-width: 560px) { .dr-panel { top: auto; bottom: 6px; } .dr-milk { bottom: 6px; } }
@media (prefers-reduced-motion: reduce) { .dr-tag.is-need { animation: none; } }
