.seq-root{display:flex;flex-direction:column;gap:10px}.dbd-vision-viewer{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:12px;overflow:hidden;background:transparent;cursor:ew-resize;touch-action:none;-webkit-user-select:none;user-select:none;outline:none;min-height:240px}@media (max-width: 768px){.dbd-vision-viewer{border-radius:8px;min-height:200px}}.dbd-vision-viewer:focus-visible{outline:2px solid var(--color-primary, #ff7a45);outline-offset:2px}.dbd-vision-bg-grid{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.05) 0%,transparent 70%),linear-gradient(rgba(109,82,64,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(109,82,64,.08) 1px,transparent 1px),linear-gradient(180deg,#0a0a0a,#1a1a1a);background-size:100% 100%,24px 24px,24px 24px,100% 100%;background-position:center,center,center,center;border-radius:12px}@media (max-width: 768px){.dbd-vision-bg-grid{background-size:100% 100%,18px 18px,18px 18px,100% 100%}}.seq-img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.dbd-vision-loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:var(--space-md, 24px);text-align:center;color:var(--text-secondary, #6b5d50);background:color-mix(in srgb,var(--bg-card, #f8f4ee) 88%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.dbd-vision-loading-title{font-size:15px;font-weight:700;color:var(--text-primary, #3d3228)}.dbd-vision-loading-desc{font-size:12px;color:var(--text-hint, #5d4e42)}.dbd-vision-spinner{width:28px;height:28px;border:3px solid color-mix(in srgb,var(--color-primary, #d63c30) 18%,transparent);border-top-color:var(--color-primary, #d63c30);border-radius:50%;animation:dbd-vision-spin .8s linear infinite}@keyframes dbd-vision-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.dbd-vision-spinner{animation:none}}.dbd-vision-error-title{font-size:15px;font-weight:600;color:var(--text-secondary, #6b5d50)}.dbd-vision-error-desc{font-size:12px;color:var(--text-hint, #5d4e42)}.dbd-vision-retry-btn{margin-top:8px;padding:6px 20px;border-radius:8px;border:1px solid var(--color-primary, #d63c30);background:transparent;color:var(--color-primary, #d63c30);font-size:13px;cursor:pointer;transition:background .15s}.dbd-vision-retry-btn:hover{background:var(--color-primary-rgba, rgba(214, 60, 48, .18))}.seq-hint{position:absolute;top:16px;left:50%;z-index:3;transform:translate(-50%);padding:8px 16px;border-radius:20px;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:14px;font-weight:500;pointer-events:none;white-space:nowrap;transition:opacity .4s ease;box-shadow:0 2px 12px #00000040}@media (max-width: 768px){.seq-hint{top:12px;padding:6px 12px;font-size:12px}}.seq-hint.is-hidden{opacity:0}.seq-badge{position:absolute;left:12px;bottom:12px;z-index:3;padding:6px 12px;border-radius:20px;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:13px;font-weight:600;letter-spacing:.3px;pointer-events:none;box-shadow:0 2px 8px #0003}@media (max-width: 768px){.seq-badge{left:8px;bottom:8px;padding:4px 10px;font-size:11px}}.seq-dots{display:flex;gap:3px;justify-content:center;align-items:center;padding:12px 0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}.seq-dots::-webkit-scrollbar{display:none}@media (max-width: 768px){.seq-dots{gap:2px;padding:10px 0}}.seq-dot{width:32px;height:4px;border-radius:2px;padding:0;border:none;background:#6d524033;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);flex-shrink:0;position:relative}.seq-dot:hover{background:#6d524066;transform:scaleY(1.5)}.seq-dot.is-active{background:var(--color-primary, #ff7a45);transform:scaleY(2);box-shadow:0 0 8px #ff7a4566}@media (max-width: 768px){.seq-dot{width:24px;height:3px;-webkit-tap-highlight-color:transparent}.seq-dot:active{background:#6d524080}.seq-dot.is-active{height:3px;transform:scaleY(2.5)}}.seq-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion: reduce){.seq-hint{transition:none}}