.feeding-dock{--dial-size:96px;position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:5;width:var(--dial-size);height:var(--dial-size);font:12px/1.2 var(--ui-font,system-ui,sans-serif);color:#fff0cf;isolation:isolate}
.feeding-action{position:relative;display:block;width:100%;height:100%;padding:0;border:1px solid #728d8e;border-radius:50%;background:#071823;box-shadow:0 4px 0 #031018,0 7px 16px #0008,inset 0 0 0 2px #183442;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;transform-origin:center}
.feeding-action:focus-visible{outline:3px solid #fff4bc;outline-offset:5px}
.feeding-action:active:not(:disabled){transform:scale(.96)}
.feeding-action:disabled{opacity:1;cursor:default}
.feeding-face{position:absolute;inset:16%;overflow:hidden;border-radius:50%;border:1px solid #aa89454d;background:radial-gradient(ellipse at 48% 30%,#16526c,#092535 65%,#061922);box-shadow:inset 0 -3px 6px #0005}
.feeding-face:before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from -12deg,#42c5e21b 0deg 12deg,transparent 12deg 30deg)}
.feeding-rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;pointer-events:none}
.feeding-food-track,.feeding-food-fill{stroke-width:5.5;transform:rotate(-90deg);transform-origin:50% 50%}
.feeding-food-track{stroke:#173847}.feeding-food-fill{stroke:#19d9e7;stroke-linecap:round;stroke-dasharray:0 100}
.feeding-segment{stroke:#294250;stroke-width:3.8;stroke-linecap:round}.feeding-segment.is-filled{stroke:#ffc44d}
.feeding-art{position:absolute;left:24%;top:13%;width:52%;height:52%;object-fit:contain;pointer-events:none}
.feeding-label{position:absolute;left:0;right:0;bottom:19%;color:#fff3d1;font-size:13px;line-height:1;font-weight:900;letter-spacing:.3px;text-align:center;text-shadow:0 2px #06151d;pointer-events:none}
.feeding-progress{position:absolute;left:0;right:0;bottom:6.5%;font-size:10px;line-height:1;font-weight:800;text-align:center;color:#ffcb54;pointer-events:none}
.feeding-food{position:absolute;top:0;right:-1px;display:grid;place-items:center;min-width:23px;height:23px;box-sizing:border-box;padding:0 3px;border:1.5px solid #d7b366;border-radius:50%;background:#0b2331;color:#fff3d8;font-size:12px;font-weight:800;box-shadow:0 2px 5px #0007;pointer-events:none}
.feeding-flash{position:absolute;inset:-3px;border:3px solid #84f9ff;border-radius:50%;box-shadow:0 0 9px #25e7e88a;opacity:0;pointer-events:none}
.feeding-flash.is-gold{border-color:#ffdc77;box-shadow:0 0 12px #ffcb5499}
.feeding-burst{position:absolute;left:50%;top:42%;width:0;height:0;pointer-events:none}.feeding-burst i{position:absolute;display:block;width:6px;height:6px;border:1px solid #ffe69b;border-radius:35%;background:#ffb52e;opacity:0}
.feeding-burst i:nth-child(2n){width:4px;height:8px;background:#48eaf0;border-color:#c2ffff}
.feeding-prize{position:absolute;top:-8px;left:50%;opacity:0;pointer-events:none;color:#ffda6e;font-size:21px;line-height:1;font-weight:900;text-shadow:0 2px 0 #382305,1px 0 #382305,-1px 0 #382305}
.feeding-notice{position:absolute;right:0;bottom:calc(100% + 15px);width:max-content;max-width:min(215px,calc(100vw - 35px));box-sizing:border-box;margin:0;padding:7px 10px;border:1px solid #d5b66b80;border-radius:12px;background:#082431f5;color:#fff0cb;font-size:11px;line-height:1.4;box-shadow:0 3px 10px #0004;pointer-events:none}
.feeding-notice[hidden]{display:none}.feeding-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.feeding-dock[data-state="loading"] .feeding-food-fill{stroke:#577681}
.feeding-dock[data-state="empty"] .feeding-label,.feeding-dock[data-state="paused"] .feeding-label{font-size:10px}
.feeding-dock[data-state="complete"] .feeding-progress{color:#fff2b7}
body:has(dialog[open]) .feeding-dock{visibility:hidden;pointer-events:none}

@media(max-width:600px){.feeding-dock{--dial-size:84px;right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}.feeding-label{font-size:11px}.feeding-progress{font-size:9px}.feeding-food{min-width:22px;height:22px;font-size:11px}}
@media(max-width:360px){.feeding-dock{--dial-size:78px}.feeding-label{font-size:10px}.feeding-progress{font-size:9px}}
@media(max-height:500px) and (orientation:landscape){.feeding-dock{--dial-size:76px;right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px))}.feeding-label{font-size:10px}.feeding-progress{font-size:9px}.feeding-food{min-width:21px;height:21px;font-size:10px}}

.feeding-action:hover{background:#0b2431}
