.dd-tt{--tt-w:40rem;--tt-h:18rem;--tt-stub:9rem;--tt-h-v:20rem;--tt-stub-v:4.5rem;--tt-stub-inset:24px;--tt-hole:8px;--tt-pitch:20px;--tt-r:calc(var(--tt-hole) / 2);--tt-bg:var(--dd-object);--tt-ink:var(--dd-ink);--tt-stub-bg:var(--dd-amber);--tt-stub-ink:var(--dd-object);--tt-edge:color-mix(in oklab, var(--dd-blue) 35%, transparent);--tt-perf:var(--dd-amber-ember);width:100%;max-width:var(--tt-w);color:var(--tt-ink);-webkit-tap-highlight-color:transparent;position:relative;container-type:inline-size}.dd-tt-stage{transition:transform var(--dur-reveal) var(--dd-ease);position:relative}.dd-tt-plane{height:var(--tt-h);transform:perspective(1000px) rotateX(var(--tt-rx,0deg)) rotateY(var(--tt-ry,0deg));flex-direction:row;display:flex;position:relative}.dd-tt-body{border:1px solid var(--tt-edge);border-right:1px solid var(--tt-perf);border-radius:var(--dd-radius) 0 0 var(--dd-radius);background-color:var(--tt-bg);min-width:0;color:inherit;-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 100% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 100% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 100% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);-webkit-mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);background-clip:padding-box;outline:none;flex:auto;text-decoration:none;display:block;position:relative;overflow:hidden;-webkit-mask-position:0 0,100% 0;mask-position:0 0,100% 0;-webkit-mask-repeat:no-repeat,no-repeat round;mask-repeat:no-repeat,no-repeat round}.dd-tt-art{pointer-events:none;position:absolute;inset:0;overflow:hidden}.dd-tt-art-img{inset:calc(var(--tt-parallax,6px) * -1);transform:translate(var(--tt-art-x,0px), var(--tt-art-y,0px));position:absolute}.dd-tt-art-img img{-webkit-user-drag:none;position:absolute;inset:0}.dd-tt-scrim{background-image:linear-gradient(to top in oklab, var(--tt-bg) 0%, color-mix(in oklab, var(--tt-bg) 72%, transparent) 34%, color-mix(in oklab, var(--tt-bg) 18%, transparent) 62%, transparent 82%);position:absolute;inset:0}.dd-tt-face{padding:var(--dd-gap-rule);transform:translate(var(--tt-ink-x,0px), var(--tt-ink-y,0px));flex-direction:column;gap:8px;display:flex;position:absolute;inset:auto 0 0}.dd-tt-stub{all:unset;box-sizing:border-box;z-index:1;flex:0 0 var(--tt-stub);border:1px solid var(--tt-edge);border-radius:0 var(--dd-radius) var(--dd-radius) 0;background-color:var(--tt-stub-bg);color:var(--tt-stub-ink);text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:pan-y;-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 0% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 0% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 0% 50%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);-webkit-mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);mask-size:calc(100% - var(--tt-r)) 100%, var(--tt-r) var(--tt-pitch);will-change:transform;background-clip:padding-box;border-left:0;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:16px;display:flex;position:relative;-webkit-mask-position:100% 0,0 0;mask-position:100% 0,0 0;-webkit-mask-repeat:no-repeat,no-repeat round;mask-repeat:no-repeat,no-repeat round}.dd-tt-label{color:var(--tt-stub-ink)}.dd-tt-arrow{flex:none;width:16px;height:16px}.dd-tt-stub:focus-visible{outline:2px solid var(--tt-stub-ink);outline-offset:-8px}.dd-tt-fibres{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.dd-tt-fibres path{fill:none;opacity:0;stroke:var(--tt-bg);stroke-linecap:round}@media (hover:hover) and (pointer:fine){.dd-tt[data-dd-armed] .dd-tt-stub{cursor:grab;touch-action:none}.dd-tt[data-grabbing] .dd-tt-stub{cursor:grabbing}}.dd-tt[data-used] .dd-tt-stub{visibility:hidden}.dd-tt[data-used] .dd-tt-stage{transform:translateX(calc(var(--tt-stub) / 2))}.dd-tt-art-img img,.dd-tt-face{transition:opacity var(--dur-reveal) var(--dd-ease)}.dd-tt[data-used] .dd-tt-art-img img{opacity:.6}.dd-tt[data-used] .dd-tt-face{opacity:.72}@container (max-width:419px){.dd-tt[data-orientation=auto] .dd-tt-plane{height:calc(var(--tt-h-v) + var(--tt-stub-v));flex-direction:column}.dd-tt[data-orientation=auto] .dd-tt-body{border:1px solid var(--tt-edge);border-bottom:1px solid var(--tt-perf);border-radius:var(--dd-radius) var(--dd-radius) 0 0;-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-position:0 0,0 100%;mask-position:0 0,0 100%;-webkit-mask-repeat:no-repeat,round no-repeat;mask-repeat:no-repeat,round no-repeat}.dd-tt[data-orientation=auto] .dd-tt-stub{flex:0 0 var(--tt-stub-v);margin-inline:var(--tt-stub-inset);border:1px solid var(--tt-edge);border-radius:0 0 var(--dd-radius) var(--dd-radius);-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);border-top:0;flex-direction:row;-webkit-mask-position:0 100%,0 0;mask-position:0 100%,0 0;-webkit-mask-repeat:no-repeat,round no-repeat;mask-repeat:no-repeat,round no-repeat}.dd-tt[data-orientation=auto][data-used] .dd-tt-stage{transform:translateY(calc(var(--tt-stub-v) / 2))}}.dd-tt[data-orientation=vertical] .dd-tt-plane{height:calc(var(--tt-h-v) + var(--tt-stub-v));flex-direction:column}.dd-tt[data-orientation=vertical] .dd-tt-body{border:1px solid var(--tt-edge);border-bottom:1px solid var(--tt-perf);border-radius:var(--dd-radius) var(--dd-radius) 0 0;-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 100%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-position:0 0,0 100%;mask-position:0 0,0 100%;-webkit-mask-repeat:no-repeat,round no-repeat;mask-repeat:no-repeat,round no-repeat}.dd-tt[data-orientation=vertical] .dd-tt-stub{flex:0 0 var(--tt-stub-v);margin-inline:var(--tt-stub-inset);border:1px solid var(--tt-edge);border-radius:0 0 var(--dd-radius) var(--dd-radius);-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));mask-image:linear-gradient(black, black), radial-gradient(circle at 50% 0%, transparent var(--tt-r), black calc(var(--tt-r) + .5px));-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);-webkit-mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);mask-size:100% calc(100% - var(--tt-r)), var(--tt-pitch) var(--tt-r);border-top:0;flex-direction:row;-webkit-mask-position:0 100%,0 0;mask-position:0 100%,0 0;-webkit-mask-repeat:no-repeat,round no-repeat;mask-repeat:no-repeat,round no-repeat}.dd-tt[data-orientation=vertical][data-used] .dd-tt-stage{transform:translateY(calc(var(--tt-stub-v) / 2))}@media (prefers-reduced-motion:reduce){.dd-tt-stage,.dd-tt-art-img img,.dd-tt-face{transition:none}}:root[data-dd-motion=paused] .dd-tt-stage,:root[data-dd-motion=paused] .dd-tt-art-img img,:root[data-dd-motion=paused] .dd-tt-face{transition:none}@media (forced-colors:active){.dd-tt-body,.dd-tt-stub{border-color:canvastext}}
