@property --dk-c{syntax: "<color>"; inherits: true; initial-value: rgba(106,193,252,.36);}.dk{display:grid;grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);gap:0 72px;align-items:center}.dk-list{margin:0;padding:0;list-style:none}.dk-list button{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) 8px;align-items:baseline;gap:0 12px;width:100%;padding:20px 2px 18px 0;border:0;border-top:1px solid rgba(106,193,252,.16);background:none;color:#8495B0;font:700 clamp(17px,1.45vw,21px)/1.32 var(--ox-font-sans);letter-spacing:-.01em;text-align:left;cursor:pointer;transition:color .35s}.dk-list li:last-child button{border-bottom:1px solid rgba(106,193,252,.16)}.dk-list button::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--accent);box-shadow:0 0 10px var(--accent);transform:scaleX(0);transform-origin:left center;transition:transform .6s var(--ox-ease-out)}.dk-list .n{font:600 12px/1 var(--ox-font-mono);letter-spacing:.12em;color:#5F7290;transition:color .3s}.dk-list .t{transition:translate .5s var(--ox-ease-out);text-wrap:balance}.dk-list .sq{align-self:center;width:8px;height:8px;box-sizing:border-box;border:1.5px solid rgba(106,193,252,.42);border-radius:1.5px;transition:background-color .25s,border-color .25s,box-shadow .25s}.dk-list button:hover{color:var(--ink)}.dk-list button[aria-current=true]{color:var(--ink)}.dk-list button[aria-current=true]::before{transform:scaleX(1)}.dk-list button[aria-current=true] .n{color:var(--accent)}.dk-list button[aria-current=true] .t{translate:8px 0}.dk-list button.picked .sq{background:#6AC1FC;border-color:#6AC1FC;box-shadow:0 0 8px #6AC1FC}.dk-list button:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}.dk-main{min-width:0}.dk-stage{position:relative;display:grid;padding-top:104px}.dk-sample{position:absolute;right:0;top:0;margin:0;font:600 11px/1 var(--ox-font-mono);letter-spacing:.1em;text-transform:uppercase;color:#6F82A0}.dk-sample b{color:#9FB0C8;font-weight:600}.dk-frame{grid-area:1 / 1;position:relative;z-index:40;margin:-15px;pointer-events:none}.dk-frame .crop{border-color:rgba(106,193,252,.6);transition:translate .6s cubic-bezier(.34,1.56,.64,1),border-color .45s}.dk-frame.open .crop{border-color:rgba(106,193,252,.2);transition-duration:.35s;transition-timing-function:var(--ox-ease-out)}.dk-frame.open .tl{translate:-7px -7px}.dk-frame.open .tr{translate:7px -7px}.dk-frame.open .bl{translate:-7px 7px}.dk-frame.open .br{translate:7px 7px}.dk-card{grid-area:1 / 1;position:relative;display:flex;flex-direction:column;min-width:0;border-radius:18px;overflow:hidden;background:#0A1630;border:1px solid rgba(106,193,252,.16);box-shadow:0 24px 60px rgba(0,0,0,.45);transform-origin:50% 100%;will-change:transform;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:border-color .4s,box-shadow .4s}.dk-card:nth-of-type(1){z-index:14}.dk-card:nth-of-type(2){z-index:13}.dk-card:nth-of-type(3){z-index:12}.dk-card:nth-of-type(4){z-index:11}.dk:not(.on) .dk-card:not(:nth-of-type(1)){visibility:hidden}.dk-card.top{border-color:rgba(106,193,252,.3);box-shadow:0 30px 70px rgba(0,0,0,.5)}.dk-card.held{box-shadow:0 44px 90px rgba(0,0,0,.55)}.dk-card:not(.top){cursor:pointer}.dk-card:not(.top)>*{pointer-events:none}.dk-card .vis{position:relative;display:block;aspect-ratio:16 / 9;overflow:hidden;background:#030915;-webkit-user-drag:none}.dk-card .vis canvas{display:block;width:100%;height:100%}.dk-card .veil{position:absolute;inset:0;background:#030915;opacity:0;pointer-events:none}.dk-card .cap{flex:1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;align-items:end;gap:10px 24px;padding:18px 22px 20px}.dk-card h3{grid-column:1 / -1;display:flex;gap:10px;margin:0;font:600 11.5px/1.3 var(--ox-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}.dk-card h3 .n{color:#5F7290}.dk-card .phrase{margin:0;font:750 clamp(20px,1.75vw,26px)/1.2 var(--ox-font-sans);letter-spacing:-.018em;color:var(--ink);text-wrap:balance}.dk-card .row{display:flex;align-items:center;gap:20px;margin:0}.dk-card .go{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap}.dk-card .go .arr{transition:translate .3s var(--ox-ease-out)}.dk-card .go:hover .arr{translate:3px 0}.dk-card .go:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:3px}.dk-pick{--dk-c: rgba(106, 193, 252, .36);display:inline-flex;align-items:center;gap:9px;height:38px;padding:0 15px 0 13px;border:0;color:#B9C5D8;font:650 13.5px/1 var(--ox-font-sans);white-space:nowrap;cursor:pointer;transition:color .25s,--dk-c .25s;background:linear-gradient(var(--dk-c),var(--dk-c)) 0 0 / 8px 1px,linear-gradient(var(--dk-c),var(--dk-c)) 0 0 / 1px 8px,linear-gradient(var(--dk-c),var(--dk-c)) 100% 0 / 8px 1px,linear-gradient(var(--dk-c),var(--dk-c)) 100% 0 / 1px 8px,linear-gradient(var(--dk-c),var(--dk-c)) 0 100% / 8px 1px,linear-gradient(var(--dk-c),var(--dk-c)) 0 100% / 1px 8px,linear-gradient(var(--dk-c),var(--dk-c)) 100% 100% / 8px 1px,linear-gradient(var(--dk-c),var(--dk-c)) 100% 100% / 1px 8px,rgba(8,22,50,.6);background-repeat:no-repeat}.dk-pick i{flex:none;width:8px;height:8px;box-sizing:border-box;border:1.5px solid #6AC1FC;border-radius:1.5px;transition:background-color .25s,box-shadow .25s}.dk-pick:hover{--dk-c: #6AC1FC;color:#FFFFFF}.dk-pick:focus-visible{--dk-c: #6AC1FC;color:#FFFFFF;outline:2px solid var(--accent);outline-offset:3px}.dk-pick[aria-pressed=true]{--dk-c: #6AC1FC;color:#FFFFFF}.dk-pick[aria-pressed=true] i{background:#6AC1FC;box-shadow:0 0 8px #6AC1FC;animation:dk-lit .45s cubic-bezier(.34,1.56,.64,1)}@keyframes dk-lit{0%{scale:.4}100%{scale:1}}.dk-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:34px}.dk-nav button{display:grid;place-items:center;width:46px;height:46px;padding:0;border-radius:50%;border:1px solid rgba(106,193,252,.3);background:rgba(10,22,48,.7);color:#EEF4FF;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,translate .35s var(--ox-ease-out)}.dk-nav button svg{width:16px;height:16px}.dk-nav button:hover{background:#6AC1FC;border-color:#6AC1FC;color:#06132C}.dk-nav .prev:hover{translate:-2px 0}.dk-nav .next:hover{translate:2px 0}.dk-nav button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.dk-nav .count{min-width:76px;text-align:center;font:600 13px/1 var(--ox-font-mono);letter-spacing:.1em;color:#9FB0C8}.dk-live{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media (max-width: 900px){.dk{grid-template-columns:1fr}.dk-list{display:none}}@media (max-width: 680px){.dk-stage{padding-top:72px}.dk-card{border-radius:14px}.dk-card .cap{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;gap:8px;padding:14px 16px 16px}.dk-card .phrase{font-size:20px}.dk-card .row{align-self:end;justify-content:space-between;margin-top:8px}.dk-nav{margin-top:28px}}@media (prefers-reduced-motion: reduce){.dk-list button::before,.dk-list .t,.dk-frame .crop,.dk-card,.dk-nav button{transition:none}.dk-pick[aria-pressed=true] i{animation:none}}
