#object-outline { position: fixed; z-index: 3; box-sizing: border-box; border: 2px solid #ffdf88; border-radius: 12px; box-shadow: 0 0 0 1px #64523080,0 0 10px #ffd98070; pointer-events: none; }
#object-actions { position: fixed; z-index: 7; width: 248px; height: 136px; max-width: calc(100vw - 16px); color: #fffbea; pointer-events: none; }
#object-outline[hidden], #object-actions[hidden] { display: none; }
.object-arc { position: absolute; inset: 0; width: 248px; height: 112px; fill: none; stroke: #fff0b8b0; stroke-width: 1.5; stroke-dasharray: 3 5; filter: drop-shadow(0 1px 2px #22382c); }
#object-actions:not(.has-extra-actions) .object-arc { display: none; }
.object-heading { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 5px; width: max-content; max-width: 232px; box-sizing: border-box; padding: 2px 4px 2px 12px; border-radius: 24px; background: #34473cd9; border: 1px solid #fff8d366; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); pointer-events: auto; }
.object-heading strong { font-size: 12px; font-weight: 600; }
#object-actions button { color: inherit; cursor: pointer; font: inherit; pointer-events: auto; touch-action: manipulation; }
.object-heading button { width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; font-size: 23px !important; }
.object-buttons button { position: absolute; top: 0; left: 91px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 66px; height: 66px; padding: 6px; border: 1px solid #fff4c9a0; border-radius: 50%; background: #34473cd9; box-shadow: 0 4px 12px #17251b30; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-size: 12px !important; }
.object-buttons [data-object-action=left] { top: 33px; left: 2px; }
.object-buttons [data-object-action=right] { top: 33px; left: 180px; }
.object-buttons button:hover, .object-buttons button:active { background: #576b43ed; border-color: #ffe8a0; }
.object-buttons svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.object-turn { font-size: 28px; line-height: 1; }
#object-actions button:focus-visible { outline: 2px solid #ffe5a0; outline-offset: 2px; }
@media(max-height:620px) {
 #object-actions { width: 224px; height: 112px; }
 .object-arc { width: 224px; height: 88px; }
 .object-buttons button { left: 84px; width: 56px; height: 56px; }
 .object-buttons [data-object-action=left] { top: 24px; left: 0; }
 .object-buttons [data-object-action=right] { top: 24px; left: 168px; }
 .object-heading { padding: 1px 3px 1px 10px; }
 .object-heading strong { font-size: 11px; }
 .object-heading button { width: 28px; height: 28px; }
}

#object-actions.has-extra-actions { height: 136px; }
#object-actions.is-bridge { height: 160px; }
#object-actions.has-extra-actions .object-buttons button { width: 56px; height: 56px; padding: 4px; font-size: 11px !important; }
.object-buttons [data-object-action=pickup] { left: calc(50% - 64px); top: 12px; }
.object-buttons [data-object-action=repeat] { left: calc(50% + 8px); top: 12px; }
#object-actions.is-bridge [data-object-action=pickup], #object-actions.is-bridge [data-object-action=repeat] { top: 0; }
#object-actions.is-bridge [data-object-action=left] { left: 0; top: 48px; }
#object-actions.is-bridge [data-object-action=right] { left: auto; right: 0; top: 48px; }
#repeat-pickup { position: fixed; left: max(12px,env(safe-area-inset-left)); z-index: 6; display: flex; align-items: center; gap: 8px; padding: 0 2px 0 12px; border: 1px solid #ffe6a499; border-radius: 24px; background: #34473ce8; color: #fffbea; box-shadow: 0 2px 8px #17251b30; backdrop-filter: blur(8px); font-size: 12px; }
#repeat-pickup[hidden] { display: none; }
#repeat-pickup button { min-width: 52px; min-height: 44px; border: 0; border-radius: 24px; background: transparent; color: inherit; font: inherit; cursor: pointer; touch-action: manipulation; }
#repeat-pickup button:focus-visible { outline: 2px solid #ffe5a0; }
@media(max-height:620px) {
 #object-actions.has-extra-actions { height: 112px; }
 #object-actions.is-bridge { width: 248px; height: 112px; }
 #object-actions.is-bridge [data-object-action=left], #object-actions.is-bridge [data-object-action=right] { top: 24px; }
 #object-actions.is-bridge .object-arc { width: 248px; }
 .object-buttons [data-object-action=pickup], .object-buttons [data-object-action=repeat] { top: 4px; }
}
