/* One shared, slow sway. The arrow moves; its label and target stay still. */
@keyframes oc-guidance-sway{0%,100%{transform:translateX(3px);opacity:.72}50%{transform:translateX(-4px);opacity:1}}
#oc-scale-picker .oc-character-pointer,.oc-next-hint .oc-hint-direction svg{animation:oc-guidance-sway 2.8s cubic-bezier(.45,0,.55,1) infinite}
body[data-oc-tips=off] #oc-scale-picker .oc-character-cue{display:none!important}
.oc-next-hint{box-sizing:border-box;position:fixed;left:0;top:0;z-index:90;display:flex;align-items:center;gap:8px;width:258px;max-width:calc(100vw - 24px);min-height:68px;padding:8px 4px 8px 10px;border:1px solid oklch(86% .018 260);border-radius:6px;background:oklch(98% .006 260);color:oklch(25% .05 265);box-shadow:0 3px 12px oklch(25% .05 265 / .07);font-family:var(--font-body,Onest,system-ui,sans-serif)}
.oc-next-hint[hidden]{display:none!important}
.oc-guidance-slot{box-sizing:border-box;grid-column:1/-1;width:100%;min-width:0}
.oc-next-hint.is-inline{position:relative;z-index:1;width:100%;max-width:none;min-height:64px;border:0;padding:6px 0;background:transparent;box-shadow:none}
.oc-hint-copy{display:flex;flex:1;flex-direction:column;gap:3px;min-width:0;text-align:left}
.oc-hint-copy strong{font-size:13px;line-height:1.35;font-weight:700}
.oc-hint-copy>span{font-size:12px;line-height:1.4;color:oklch(37% .04 260)}
.oc-next-hint .oc-hint-action{min-height:32px;padding:0;border:0;background:transparent;box-shadow:none;color:inherit;font:inherit;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.oc-hint-direction{display:block;width:32px;height:32px;flex:none;color:oklch(51% .17 40);transform:rotate(var(--oc-hint-angle,0deg))}
.oc-hint-direction svg{display:block;width:32px;height:32px}
.oc-next-hint[data-direction=right]{--oc-hint-angle:180deg}
.oc-next-hint[data-direction=down]{--oc-hint-angle:-90deg}
.oc-next-hint[data-direction=up]{--oc-hint-angle:90deg}
.oc-next-hint .oc-hint-dismiss{flex:none;align-self:flex-start;display:grid;place-items:center;width:44px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:3px;box-shadow:none;background:transparent;color:oklch(37% .04 260);font:400 20px/1 system-ui;cursor:pointer}
.oc-hint-dismiss:hover{color:oklch(51% .17 40)}
.oc-guidance-tools{display:flex;justify-content:flex-end;max-width:1280px;margin:8px auto 18px;padding:0 24px}
.oc-guidance-toggle{min-height:44px;padding:6px 0;border:0;background:transparent;box-shadow:none;color:oklch(37% .04 260);font:500 12px/1.4 var(--font-body,Onest,system-ui,sans-serif);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.oc-next-hint button:focus-visible,.oc-guidance-toggle:focus-visible{outline:2px solid oklch(51% .17 40);outline-offset:3px}
@media(max-width:590px){.oc-next-hint{width:238px}.oc-guidance-tools{padding:0 18px}}
@media(prefers-reduced-motion:reduce){#oc-scale-picker .oc-character-pointer,.oc-next-hint .oc-hint-direction svg{animation:none!important;transform:none;opacity:1}}
@media(forced-colors:active){.oc-next-hint{border:1px solid CanvasText;background:Canvas;color:CanvasText}.oc-hint-copy>span,.oc-hint-direction{color:CanvasText}}