.vv-frame{--lijn: color-mix(in srgb, var(--color-bone) 10%, transparent);--lijn-zacht: color-mix(in srgb, var(--color-bone) 7%, transparent);--tekst-zacht: color-mix(in srgb, var(--color-bone) 78%, transparent);--vv-ease: cubic-bezier(.65, 0, .25, 1);position:relative;width:100%;border-radius:var(--pnl-radius, 22px);overflow:hidden;isolation:isolate;--diepte: 0 24px 52px -40px rgba(0, 0, 0, .95);font-family:var(--font-sans);color:var(--color-bone);container-type:inline-size}.vv-frame:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(70% 55% at 80% -6%,color-mix(in srgb,var(--color-amber) 12%,transparent),transparent 64%)}.vv-scaler{position:absolute;top:0;left:0;transform-origin:0 0}.vv-g{position:absolute;background:var(--lijn-zacht)}.vv-g.v{top:0;bottom:0;width:1px}.vv-g.h{left:0;right:0;height:1px}.vv-obj{position:absolute;opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .6s var(--vv-ease);pointer-events:none;--diepte: 0 40px 80px -36px rgba(0, 0, 0, .85)}.vv-obj.on{opacity:1;transform:none}.vv-kaart{border-radius:18px;padding:26px}.vv-kaart-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 20px}.vv-kaart h3{margin:0;font-family:var(--font-display);font-weight:500;font-size:26px;letter-spacing:-.015em}.vv-av{flex:none;width:52px;height:52px;display:block}.vv-av.klein{width:40px;height:40px}.vv-av svg{display:block;width:100%;height:100%}.vv-boog{fill:none;stroke:var(--color-amber);stroke-width:8;stroke-linecap:round}.vv-av text{font-family:var(--font-display);font-size:34px;font-weight:600;fill:var(--color-bone)}.vv-hoorn{fill:var(--color-bone)}.vv-chip{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-size:12.5px;font-weight:600;padding:5px 10px;border-radius:7px;background:color-mix(in srgb,var(--color-amber) 16%,transparent);color:var(--color-amber);transition:background .3s ease,color .3s ease}.vv-chip i{width:7px;height:7px;border-radius:50%;background:currentColor}.vv-chip.knip i{animation:vv-knip 1s ease-in-out infinite}.vv-chip.is-sage{background:color-mix(in srgb,var(--color-sage) 18%,transparent);color:var(--color-sage)}.vv-chip.is-clay{background:color-mix(in srgb,var(--color-clay) 20%,transparent);color:var(--color-clay)}.vv-chip.is-stil{background:color-mix(in srgb,var(--color-bone) 8%,transparent);color:var(--color-stone)}.vv-mono{font-family:var(--font-mono);font-weight:400;font-variant-numeric:tabular-nums}@keyframes vv-knip{50%{opacity:0}}.vv-btn{height:42px;padding:0 18px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14.5px;font-weight:600;transition:transform .15s ease,background .2s ease}.vv-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.vv-btn.ghost{color:var(--tekst-zacht);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-bone) 14%,transparent)}.vv-btn.main{background:var(--color-amber);color:var(--color-amber-ink);font-weight:650}.vv-btn.main.press{transform:scale(.95);background:var(--color-amber-d)}.vv-node{position:absolute;border-radius:14px;background:color-mix(in srgb,var(--color-bone) 5%,transparent);box-shadow:inset 0 0 0 1px var(--lijn);opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .55s var(--vv-ease)}.vv-node.on{opacity:1;transform:none}.vv-node small{display:block;font-size:12.5px;color:var(--color-stone)}.vv-wire{position:absolute;background:color-mix(in srgb,var(--color-bone) 24%,transparent);transform-origin:top left;transition:transform .45s var(--vv-ease)}.vv-wire.on{transform:none}.vv-ok{flex:none;width:28px;height:28px;border-radius:50%;background:var(--color-sage);display:grid;place-items:center}.vv-ok svg{width:14px;height:14px;stroke:var(--color-ink);fill:none;stroke-width:2.4}.vv-schuif{flex:none;position:relative;width:58px;height:34px;border-radius:99px;background:color-mix(in srgb,var(--color-bone) 12%,transparent);box-shadow:inset 0 0 0 1px var(--lijn);transition:background .45s ease}.vv-schuif:after{content:"";position:absolute;top:4px;left:4px;width:26px;height:26px;border-radius:50%;background:var(--color-bone);box-shadow:0 3px 8px #00000059;transition:transform .5s var(--vv-ease)}.vv-schuif.aan{background:var(--color-amber);box-shadow:none}.vv-schuif.aan:after{transform:translate(24px)}.vv-rij{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-top:1px solid var(--lijn);font-size:15px}.vv-rij:first-child{border-top:0}.vv-rij .k{color:var(--color-stone)}.vv-rij .v{font-family:var(--font-display);font-weight:500;color:var(--color-bone);font-variant-numeric:tabular-nums}.vv-pp{position:absolute;left:18px;bottom:18px;z-index:5;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;background:color-mix(in srgb,var(--color-bone) 10%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-bone) 20%,transparent);color:var(--color-bone);transition:transform .25s var(--ease-uit),background .25s}@media(hover:hover){.vv-pp:hover{transform:scale(1.06);background:color-mix(in srgb,var(--color-bone) 16%,transparent)}}.vv-pp:focus-visible{outline:2px solid var(--color-amber);outline-offset:3px}.vv-pp svg{width:13px;height:13px;fill:currentColor}@container (max-width: 480px){.vv-pp{width:32px;height:32px;left:10px;bottom:10px}.vv-pp svg{width:10px;height:10px}}.vv-frame.is-pauze *{animation-play-state:paused!important}@media(prefers-reduced-motion:reduce){.vv-frame *,.vv-frame *:before,.vv-frame *:after{animation:none!important;transition:none!important}.vv-pp{display:none}}.papier,.rand.papier{--vlak: var(--color-paper-warm);--vlak-eind: color-mix(in srgb, var(--color-paper) 70%, var(--color-paper-line));--rand-fel: rgba(255, 255, 255, .95);--rand-flauw: rgba(24, 26, 31, .08);--diepte: 0 44px 80px -40px rgba(0, 0, 0, .9), 0 2px 6px -2px rgba(0, 0, 0, .25);--color-bone: #181a1f;--color-ink: #fbfaf6;--color-stone: var(--color-paper-sub);--color-ash: var(--color-paper-sub);--lijn: color-mix(in srgb, #181a1f 9%, transparent);--lijn-zacht: color-mix(in srgb, #181a1f 6%, transparent);--tekst-zacht: color-mix(in srgb, #181a1f 70%, transparent);--amber-letter: color-mix(in srgb, var(--color-amber-d) 70%, #181a1f);--sage-letter: color-mix(in srgb, var(--color-sage) 55%, #181a1f);--clay-letter: color-mix(in srgb, var(--color-clay) 62%, #181a1f);color:#181a1f}.papier .vv-chip{background:color-mix(in srgb,var(--color-amber) 18%,transparent);color:var(--amber-letter)}.papier .vv-chip.is-sage{background:color-mix(in srgb,var(--color-sage) 22%,transparent);color:var(--sage-letter)}.papier .vv-chip.is-clay{background:color-mix(in srgb,var(--color-clay) 22%,transparent);color:var(--clay-letter)}.papier .vv-chip.is-stil{background:color-mix(in srgb,#181a1f 6%,transparent);color:var(--color-paper-sub)}.papier .vv-ok svg{stroke:#181a1f}.papier .vv-node,.vv-node.papier{background:#fff;box-shadow:inset 0 0 0 1px var(--lijn),0 10px 24px -18px #00000080}.papier .vv-wit{background:#fff;box-shadow:inset 0 0 0 1px var(--lijn)}.vv-frame.vv-licht{--vlak: color-mix(in srgb, var(--color-sand) 85%, var(--color-paper-line));--vlak-eind: var(--color-sand);--rand-fel: rgba(255, 255, 255, .9);--rand-flauw: rgba(24, 26, 31, .06);--diepte: none;--lijn-zacht: color-mix(in srgb, #181a1f 7%, transparent)}.vv-licht:before{background:radial-gradient(70% 55% at 80% -6%,color-mix(in srgb,var(--color-amber) 16%,transparent),transparent 64%)}.vv-licht .vv-obj{--diepte: 0 30px 60px -34px rgba(24, 26, 31, .45), 0 1px 3px rgba(24, 26, 31, .08)}.vv-licht .vv-pp{background:color-mix(in srgb,#181a1f 8%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,#181a1f 16%,transparent);color:#181a1f}
