/* ND Shield captcha (assets/shield.js) */
.nd-shield { --sh-bg: #fff; --sh-fg: #1a1a1c; --sh-mute: rgba(26, 26, 28, .55); --sh-line: #e6e3f0; --sh-soft: #f6f4fd; --sh-acc: #864ffe; --sh-ok: #10b981; --sh-err: #ef4444;
  width: 100%; max-width: 380px; font-family: var(--font-inter-tight, 'Inter Tight', system-ui, sans-serif); color: var(--sh-fg); text-align: left; }
.nd-shield--dark { --sh-bg: rgba(255, 255, 255, .05); --sh-fg: rgba(255, 255, 255, .92); --sh-mute: rgba(255, 255, 255, .55); --sh-line: rgba(255, 255, 255, .16); --sh-soft: rgba(255, 255, 255, .07); }
.nd-shield *, .nd-shield *::before, .nd-shield *::after { box-sizing: border-box; }

.nd-shield__start { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 62px; padding: 10px 14px; border: 1px solid var(--sh-line); border-radius: 14px; background: var(--sh-bg); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.nd-shield__start:hover { border-color: rgba(134, 79, 254, .55); }
.nd-shield__start:focus-visible { outline: 2px solid var(--sh-acc); outline-offset: 2px; }
.nd-shield__start:disabled { cursor: default; }
.nd-shield__box { position: relative; flex: none; width: 26px; height: 26px; border: 2px solid var(--sh-line); border-radius: 8px; background: transparent; transition: background .25s, border-color .25s; }
.nd-shield__box i { position: absolute; inset: 0; }
.nd-shield.is-open .nd-shield__box { border-color: var(--sh-acc); }
.nd-shield.is-open:not(.is-ok) .nd-shield__box i { border: 2px solid transparent; border-top-color: var(--sh-acc); border-radius: 50%; inset: 3px; animation: nd-sh-spin .9s linear infinite; }
.nd-shield.is-ok .nd-shield__box { background: var(--sh-ok); border-color: var(--sh-ok); }
.nd-shield.is-ok .nd-shield__box i::after { content: ""; position: absolute; left: 7px; top: 3px; width: 7px; height: 12px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); animation: nd-sh-pop .3s cubic-bezier(.2, .9, .3, 1.4); }
.nd-shield__label { flex: 1; display: grid; gap: 1px; font-size: 15px; font-weight: 500; line-height: 1.25; }
.nd-shield__label small { font-size: 12px; font-weight: 400; color: var(--sh-mute); }
.nd-shield__brand { display: grid; justify-items: center; gap: 2px; font-size: 9.5px; font-weight: 600; letter-spacing: .04em; color: var(--sh-mute); text-transform: uppercase; }
.nd-shield__brand svg { width: 22px; height: 22px; fill: rgba(134, 79, 254, .18); stroke: var(--sh-acc); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }

.nd-shield__panel { margin-top: 8px; padding: 12px; border: 1px solid var(--sh-line); border-radius: 16px; background: var(--sh-bg); box-shadow: 0 18px 40px -22px rgba(60, 30, 140, .45); animation: nd-sh-in .28s cubic-bezier(.2, .9, .3, 1.1) both; }
.nd-shield__panel[hidden] { display: none; }
.nd-shield__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.nd-shield__head b { font-size: 13.5px; font-weight: 600; }
.nd-shield__icon { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--sh-line); border-radius: 10px; background: transparent; color: inherit; cursor: pointer; }
.nd-shield__icon:hover { background: var(--sh-soft); }
.nd-shield__icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.nd-shield__stage { position: relative; width: 100%; aspect-ratio: 2 / 1; overflow: hidden; border-radius: 12px; background: var(--sh-soft); user-select: none; -webkit-user-select: none; }
.nd-shield__bg { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.nd-shield__piece { position: absolute; left: 0; height: auto; pointer-events: none; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .45)); will-change: transform; }
.nd-shield__flash { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .55) 50%, transparent 70%); transform: translateX(-100%); }
.nd-shield__stage.is-ok .nd-shield__flash { animation: nd-sh-flash .8s ease-out; }
.nd-shield__load { position: absolute; inset: 0; display: none; place-items: center; background: var(--sh-soft); }
.nd-shield__stage.is-loading .nd-shield__load { display: grid; }
.nd-shield__load i { width: 26px; height: 26px; border: 3px solid rgba(134, 79, 254, .2); border-top-color: var(--sh-acc); border-radius: 50%; animation: nd-sh-spin .8s linear infinite; }

.nd-shield__track { position: relative; height: 48px; margin-top: 10px; border: 1px solid var(--sh-line); border-radius: 999px; background: var(--sh-soft); overflow: hidden; cursor: pointer; }
.nd-shield__track:focus-visible { outline: 2px solid var(--sh-acc); outline-offset: 2px; }
.nd-shield__fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 999px; background: linear-gradient(90deg, rgba(134, 79, 254, .18), rgba(226, 72, 170, .28)); }
.nd-shield__hint { position: absolute; inset: 0; display: grid; place-items: center; padding-left: 40px; font-size: 13px; color: var(--sh-mute); pointer-events: none; transition: opacity .2s; }
.nd-shield.is-dragging .nd-shield__hint { opacity: 0; }
.nd-shield__knob { position: absolute; left: 2px; top: 2px; display: grid; place-items: center; width: 54px; height: 42px; border-radius: 999px; background: linear-gradient(135deg, #864ffe, #e248aa); color: #fff; box-shadow: 0 6px 16px -6px rgba(134, 79, 254, .8); cursor: grab; will-change: transform; transition: box-shadow .2s; }
.nd-shield.is-dragging .nd-shield__knob { cursor: grabbing; box-shadow: 0 8px 22px -6px rgba(134, 79, 254, .95); }
.nd-shield__knob svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.nd-shield.is-checking .nd-shield__knob svg { animation: nd-sh-spin .8s linear infinite; }
.nd-shield.is-ok .nd-shield__knob { background: var(--sh-ok); box-shadow: none; }

.nd-shield__msg { min-height: 18px; margin: 8px 2px 0; font-size: 12.5px; color: var(--sh-mute); }
.nd-shield__msg.is-error { color: var(--sh-err); }
.nd-shield__msg.is-ok { color: var(--sh-ok); font-weight: 600; }
.nd-shield.is-error .nd-shield__panel, .nd-shield.is-error .nd-shield__start { animation: nd-sh-shake .45s; border-color: var(--sh-err); }
.nd-shield__nojs { margin: 8px 0 0; font-size: 13px; color: var(--sh-err); }

@keyframes nd-sh-spin { to { transform: rotate(360deg); } }
@keyframes nd-sh-in { from { opacity: 0; transform: translateY(-6px); } }
@keyframes nd-sh-pop { from { transform: rotate(45deg) scale(0); } }
@keyframes nd-sh-flash { to { transform: translateX(100%); } }
@keyframes nd-sh-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
@media (prefers-reduced-motion: reduce) { .nd-shield *, .nd-shield { animation-duration: .01s !important; } }
