/* The Vees: base styles every surface shares. Each page also links its own surface sheet
   (vees-lineup.css on the homepage, vees-tips.css on the outsourcing pages, vees-band.css on the samples).
   A spot is span.vees-art[data-vee] holding img.vees-still; when the 3D layer is ready it adds .is-3d to the
   stage, the stills fade out and its canvas (.vees-canvas, which it positions and fades itself) shows the Vees. */
:root{--vees-lime:#E9F16D;--vees-ink:#13262A;--vees-ink-2:#173B40;--vees-focus:#759FA0}

.vees-art{position:relative;display:block;aspect-ratio:1;flex:none}
/* a still is the spot plus 12.5% a side (props reach past the Vee's box: tools/vees/render-stills.py), so it is drawn
   at 125%, centred, and lines up with the live Vee exactly */
.vees-still{position:absolute;left:-12.5%;top:-12.5%;display:block;width:125%;height:125%;max-width:none;object-fit:contain;transition:opacity .25s ease,transform .25s ease;pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.is-3d .vees-still{opacity:0}

.vees-canvas{display:block;pointer-events:none}
.is-3d .vees-canvas{opacity:1}

/* the lineup's control: a plain button around the spot (vees-lineup.css lays it out) */
.vees-pick{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}

/* focus: the site's ring; lime on the dark portal band */
:is(.vees-pick,.vees-pill,[data-vees-tip]):focus-visible{outline:3px solid var(--vees-focus);outline-offset:4px}
[data-vees-stage="portal"] :focus-visible{outline:3px solid var(--vees-lime);outline-offset:3px}

/* visually hidden, still read by screen readers */
.vees-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* reduced motion: no 3D is loaded at all (vees-loader.js); every Vees transition and animation lands at once,
   so end events still fire and surfaces reach their final state */
@media (prefers-reduced-motion: reduce){
  [class^="vees-"],[class*=" vees-"],[class^="vees-"]::before,[class*=" vees-"]::before,[class^="vees-"]::after,[class*=" vees-"]::after{
    transition-duration:.01ms!important;transition-delay:0s!important;
    animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;
    scroll-behavior:auto!important}
}