.obp-steps-wrap,.obp-dock,.obp-lock-scope,.obp-result{--obp-accent: var(--v3-cta, var(--action-primary));--obp-on-accent: var(--v3-cta-fg, var(--action-primary-text));--obp-soft: var(--v3-soft, color-mix(in srgb, var(--text-primary) 5%, var(--bg-surface)));--obp-line: color-mix(in srgb, var(--text-primary) 14%, var(--bg-surface));--obp-muted: var(--v3-text-muted, var(--text-secondary));--obp-ease: var(--ease-out-strong, cubic-bezier(.23, 1, .32, 1))}.obp-steps-wrap{display:grid;gap:10px;font-size:13px}.obp-steps{list-style:none;margin:0;padding:0}.obp-step{position:relative;display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:10px;align-items:center;padding:5px 0;animation:obp-rise .32s var(--obp-ease) both;animation-delay:calc(var(--i) * 60ms)}.obp-step:not(:last-child):before,.obp-step:not(:last-child):after{content:"";position:absolute;left:9px;top:27px;bottom:-3px;width:2px;border-radius:2px;background:var(--obp-line)}.obp-step:not(:last-child):after{background:var(--obp-accent);transform:scaleY(0);transform-origin:top;transition:transform .52s var(--obp-ease)}.obp-step[data-state=done]:after{transform:scaleY(1)}.obp-node{position:relative;width:20px;height:20px;border-radius:50%;border:2px solid var(--obp-line);background:var(--bg-surface);display:grid;place-items:center;transition:background .32s var(--obp-ease),border-color .32s var(--obp-ease)}.obp-node svg{width:12px;height:12px;color:var(--obp-on-accent);stroke-width:3;opacity:0;transform:scale(.6);transition:opacity .2s var(--obp-ease) 80ms,transform .32s var(--obp-ease) 80ms}.obp-bang{display:none;color:var(--bg-surface);font-weight:700;font-size:11px;line-height:1}.obp-arc{position:absolute;inset:-2px;border-radius:50%;border:2px solid transparent;opacity:0}.obp-step[data-state=active] .obp-node{border-color:color-mix(in srgb,var(--obp-accent) 28%,transparent)}.obp-step[data-state=active] .obp-arc{opacity:1;border-top-color:var(--obp-accent);animation:obp-spin .9s linear infinite}.obp-step[data-state=active] .obp-node:after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--obp-accent);opacity:0;animation:obp-halo 1.8s var(--obp-ease) infinite}.obp-step[data-state=done] .obp-node{background:var(--obp-accent);border-color:var(--obp-accent);animation:obp-pop .32s var(--obp-ease)}.obp-step[data-state=done] .obp-node svg{opacity:1;transform:none}.obp-step[data-state=error] .obp-node{background:var(--danger);border-color:var(--danger)}.obp-step[data-state=error] .obp-bang{display:block}.obp-step[data-state=error]{animation:obp-shake .38s ease-in-out}.obp-label{color:var(--obp-muted);transition:color .32s var(--obp-ease)}.obp-step[data-state=active] .obp-label{color:var(--text-primary);font-weight:500}.obp-step[data-state=done] .obp-label{color:var(--text-secondary)}.obp-step[data-state=error] .obp-label{color:var(--danger-readable, var(--danger));font-weight:500}.obp-detail{font-size:var(--text-xs);color:var(--obp-muted);font-variant-numeric:tabular-nums}.obp-segs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px}.obp-seg{position:relative;height:4px;border-radius:4px;background:var(--obp-soft);overflow:hidden}.obp-seg i{position:absolute;inset:0;border-radius:inherit;background:var(--obp-accent);transform:scaleX(0);transform-origin:left;transition:transform .52s var(--obp-ease)}.obp-seg[data-state=done] i{transform:scaleX(1)}.obp-seg[data-state=active] i{width:40%;transform:none;animation:obp-seg-slide 1.3s ease-in-out infinite}.obp-seg[data-state=error] i{transform:scaleX(1);background:var(--danger)}.obp-meta{margin:0;font-size:var(--text-xs);color:var(--text-secondary)}.obp-bar{--obp-accent: var(--v3-cta, var(--action-primary));position:relative;height:6px;border-radius:999px;background:color-mix(in srgb,var(--text-primary) 7%,var(--bg-surface));overflow:hidden}.obp-bar>span{position:relative;display:block;height:100%;border-radius:inherit;background:var(--obp-accent);overflow:hidden;transition:width .55s var(--ease-out-strong, ease-out)}.obp-bar>span:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--bg-surface) 55%,transparent),transparent);transform:translate(-100%);animation:obp-sweep 1.6s ease-in-out infinite}.obp-bar[data-status=done]>span{background:var(--success)}.obp-bar[data-status=done]>span:after{animation:none}.obp-items{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.obp-item{display:inline-flex;align-items:center;gap:6px;padding:3px 8px 3px 6px;border-radius:999px;border:1px solid color-mix(in srgb,var(--text-primary) 10%,var(--bg-surface));background:var(--bg-surface);font-size:var(--text-xs);color:var(--v3-text-muted, var(--text-secondary));transition:border-color .2s ease-out,background .2s ease-out,color .2s ease-out}.obp-swatch{width:12px;height:12px;border-radius:50%;background:var(--obp-swatch);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text-primary) 20%,transparent);opacity:.45;transition:opacity .32s ease-out}.obp-item-mark{display:inline-grid;place-items:center;width:0;overflow:hidden;transition:width .2s ease-out}.obp-item[data-state=active]{color:var(--text-primary);border-color:var(--v3-cta, var(--action-primary));box-shadow:0 0 0 3px color-mix(in srgb,var(--v3-cta, var(--action-primary)) 14%,transparent)}.obp-item[data-state=active] .obp-swatch{animation:obp-breathe 1.2s ease-in-out infinite}.obp-item[data-state=done]{color:var(--success-readable, var(--success));background:var(--success-bg);border-color:transparent}.obp-item[data-state=error]{color:var(--danger-readable, var(--danger));background:var(--danger-bg);border-color:transparent;animation:obp-shake .38s ease-in-out}.obp-item[data-state=done] .obp-swatch,.obp-item[data-state=error] .obp-swatch{opacity:1}.obp-item[data-state=done] .obp-item-mark,.obp-item[data-state=error] .obp-item-mark{width:12px}@keyframes obp-breathe{0%,to{opacity:.45}50%{opacity:1}}.obp-lock-scope{position:relative}.obp-lock-body{transition:filter .32s var(--obp-ease)}.obp-lock-scope[data-locked] .obp-lock-body{filter:saturate(.6)}.obp-scrim{position:absolute;inset:0;z-index:2;display:grid;place-items:center;overflow:hidden;border-radius:inherit;background:color-mix(in srgb,var(--bg-surface) 58%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .32s var(--obp-ease),visibility 0s linear .32s}.obp-lock-scope[data-locked]>.obp-scrim{opacity:1;visibility:visible;transition:opacity .32s var(--obp-ease)}.obp-scrim:before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,color-mix(in srgb,var(--obp-accent) 9%,transparent) 50%,transparent 65%);transform:translate(-100%);animation:obp-sweep 2.4s ease-in-out infinite}.obp-lock-pill{position:relative;display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:var(--bg-surface);border:1px solid var(--obp-line);box-shadow:var(--shadow-lg);font-size:13px;color:var(--text-secondary);opacity:0;transform:translateY(6px) scale(.96);transition:opacity .32s var(--obp-ease),transform .52s var(--obp-ease)}.obp-lock-pill svg{color:var(--obp-accent)}.obp-lock-scope[data-locked] .obp-lock-pill{opacity:1;transform:none;transition-delay:90ms}.obp-result{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--radius-lg);font-size:13px;animation:obp-rise .42s var(--obp-ease) both}.obp-result[data-tone=ok]{background:var(--success-bg);color:var(--success-readable, var(--success))}.obp-result[data-tone=warn]{background:var(--warning-bg);color:var(--warning-readable, var(--warning));animation:obp-rise .42s var(--obp-ease) both,obp-shake .4s ease-in-out .12s}.obp-result-text{display:grid;gap:2px;min-width:0}.obp-result-text strong{color:var(--text-primary);font-weight:600}.obp-result-text p{margin:0;color:var(--text-secondary)}.obp-result-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.obp-result-icon{flex:none;margin-top:2px}.obp-badge{position:relative;flex:none;width:30px;height:30px}.obp-badge svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.obp-badge-ring{stroke-dasharray:107;stroke-dashoffset:107;transform:rotate(-90deg);transform-origin:center;animation:obp-draw .52s var(--obp-ease) forwards}.obp-badge-tick{stroke-dasharray:24;stroke-dashoffset:24;animation:obp-draw .32s var(--obp-ease) .38s forwards}.obp-badge:after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid currentColor;opacity:0;animation:obp-halo .76s var(--obp-ease) .62s}.obp-ring{flex:none;transform:rotate(-90deg)}.obp-ring circle{fill:none;stroke-width:2.6}.obp-ring-track{stroke:var(--obp-soft, color-mix(in srgb, var(--text-primary) 8%, transparent))}.obp-ring-fill{stroke:var(--obp-accent, var(--v3-cta, var(--action-primary)));stroke-linecap:round;transition:stroke-dashoffset .3s ease-out,stroke .32s ease-out}.obp-ring[data-spin]{animation:obp-spin-ring 1s linear infinite}.obp-ring[data-status=done] .obp-ring-fill{stroke:var(--success)}.obp-ring[data-status=error] .obp-ring-fill{stroke:var(--danger)}.obp-dock{position:fixed;right:20px;bottom:20px;z-index:var(--z-dropdown);display:grid;gap:8px;justify-items:end;pointer-events:none}.obp-job{pointer-events:auto;display:flex;align-items:center;gap:10px;max-width:min(380px,calc(100vw - 32px));padding:8px 8px 8px 10px;border-radius:999px;background:var(--bg-surface);border:1px solid var(--obp-line);box-shadow:var(--shadow-lg);font-size:13px;animation:obp-dock-in .52s var(--obp-ease) both}.obp-job-text{display:grid;min-width:0;line-height:1.3;padding-right:4px}.obp-job-text strong{font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.obp-job-text span{font-size:var(--text-xs);color:var(--text-secondary);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.obp-job[data-status=done]{animation:obp-pop .36s var(--obp-ease)}@media(max-width:768px){.obp-dock{right:16px;left:16px;bottom:calc(80px + env(safe-area-inset-bottom,0px))}}@keyframes obp-rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes obp-dock-in{0%{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:none}}@keyframes obp-spin{to{transform:rotate(360deg)}}@keyframes obp-spin-ring{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}@keyframes obp-sweep{to{transform:translate(100%)}}@keyframes obp-seg-slide{0%{transform:translate(-100%)}to{transform:translate(250%)}}@keyframes obp-halo{0%{opacity:.45;transform:scale(1)}to{opacity:0;transform:scale(1.7)}}@keyframes obp-pop{0%{transform:scale(1)}40%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes obp-shake{0%,to{transform:none}20%{transform:translate(-6px)}45%{transform:translate(5px)}70%{transform:translate(-3px)}88%{transform:translate(1px)}}@keyframes obp-draw{to{stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){.obp-steps-wrap *,.obp-dock *,.obp-lock-scope *,.obp-result,.obp-result *,.obp-bar *,.obp-items *,.obp-steps-wrap *:before,.obp-steps-wrap *:after,.obp-dock *:before,.obp-dock *:after,.obp-lock-scope *:before,.obp-lock-scope *:after,.obp-result *:before,.obp-result *:after,.obp-bar *:before,.obp-bar *:after,.obp-items *:before,.obp-items *:after{animation-duration:1ms;animation-iteration-count:1;transition-duration:1ms}}
