.hd-tool[data-tint=rose]{--hd-tint:var(--tint-rose)}.hd-tool[data-tint=blue]{--hd-tint:var(--tint-blue)}.hd-tool[data-tint=violet]{--hd-tint:var(--tint-violet)}.hd-tool[data-tint=mint]{--hd-tint:var(--tint-mint)}.hd-tool[data-tint=lime]{--hd-tint:var(--tint-lime)}.hd-tool[data-tint=amber],.hd-tool[data-tint=peach]{--hd-tint:var(--tint-peach)}.hd-tool{border:1px solid var(--hairline);background:var(--bg);text-align:left;cursor:pointer;border-radius:18px;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:18px;padding:18px 18px 20px;transition:transform .15s cubic-bezier(.2,0,0,1),box-shadow .15s cubic-bezier(.2,0,0,1);display:flex}.hd-tool:hover:not(:disabled){box-shadow:var(--sh-2);transform:translateY(-1px)}.hd-tool:disabled{opacity:.55;cursor:not-allowed}.hd-tool-plate{width:56px;height:56px;color:var(--ink);background:radial-gradient(at 24% 18%, var(--hd-tint,var(--surface)) 0%, var(--bg) 80%);border-radius:16px;justify-content:center;align-items:center;display:flex;box-shadow:inset 0 0 0 1px #0000000d}.hd-tool-plate svg{width:22px;height:22px}.hd-tool-txt{flex-direction:column;gap:6px;min-width:0;display:flex}.hd-tool-name{font:600 17px/1.2 var(--font-display);letter-spacing:-.014em;color:var(--ink)}.hd-tool-desc{font:400 13.5px/1.45 var(--font-text);color:var(--ink-2);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.hd-tool[data-media]{isolation:isolate;aspect-ratio:4/5;background:var(--surface);border:0;border-radius:22px;justify-content:flex-end;gap:0;padding:0;transition:transform .45s cubic-bezier(.2,.7,.1,1),box-shadow .45s cubic-bezier(.2,.7,.1,1);position:relative;overflow:hidden;container-type:inline-size}.hd-tool[data-media]:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 22px 44px -22px #00000080}.hd-tool[data-media]:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(#0000 44%,#0003 66%,#00000094 100%);transition:opacity .3s;position:absolute;inset:0}.hd-tool-media{background:var(--surface);display:block;position:absolute;inset:0;overflow:hidden}.hd-tool-media img,.hd-tool-media video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hd-tool-media img{transition:transform .9s cubic-bezier(.2,.7,.1,1)}.hd-tool-media video{opacity:0;transition:opacity .2s}.hd-tool-media video[data-playing]{opacity:1}.hd-tool-cap{z-index:2;font:600 24px/1.02 var(--font-display);letter-spacing:-.035em;color:var(--bg);text-wrap:balance;transition:opacity .25s,transform .45s cubic-bezier(.2,.7,.1,1);position:absolute;bottom:16px;left:18px;right:18px}.hd-tool-sheet{z-index:3;background:var(--bg);border-radius:16px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;padding:14px 12px 15px 16px;transition:transform .48s cubic-bezier(.2,.7,.1,1);display:grid;position:absolute;bottom:8px;left:8px;right:8px;transform:translateY(calc(100% + 12px));box-shadow:0 10px 30px -12px #00000059}.hd-tool-sheet .hd-tool-name{font:600 17px/1.15 var(--font-display);letter-spacing:-.02em;color:var(--ink)}.hd-tool-sheet .hd-tool-desc{font:400 14px/1.42 var(--font-text);color:var(--ink-2);-webkit-line-clamp:5;-webkit-box-orient:vertical;grid-column:1/-1;display:-webkit-box;overflow:hidden}.hd-tool-go{background:var(--signal);width:32px;height:32px;color:var(--accent-ink);border-radius:999px;place-items:center;display:grid}.hd-tool-go svg{width:16px;height:16px}.hd-tool[data-media]:is(:hover,:focus-visible):not(:disabled) .hd-tool-sheet{transform:none}.hd-tool[data-media]:is(:hover,:focus-visible):not(:disabled) .hd-tool-cap{opacity:0;transform:translateY(-8px)}.hd-tool[data-media]:is(:hover,:focus-visible):not(:disabled):after{opacity:0}.hd-tool[data-media]:hover:not(:disabled) .hd-tool-media img{transform:scale(1.06)}@media (hover:none){.hd-tool-sheet{display:none}}@container (width<=240px){.hd-tool-cap{font-size:21px;bottom:13px;left:14px;right:14px}.hd-tool-sheet{border-radius:14px;gap:5px 8px;padding:11px 9px 12px 12px;bottom:6px;left:6px;right:6px}.hd-tool-sheet .hd-tool-name{font-size:15px}.hd-tool-sheet .hd-tool-desc{-webkit-line-clamp:4;font-size:12.5px;line-height:1.38}.hd-tool-go{width:28px;height:28px}.hd-tool-go svg{width:14px;height:14px}}@container (width<=170px){.hd-tool-cap{font-size:16px;bottom:10px;left:10px;right:10px}.hd-tool-sheet{border-radius:12px;gap:4px 6px;padding:9px 7px 10px 9px;bottom:5px;left:5px;right:5px}.hd-tool-sheet .hd-tool-name{font-size:13px}.hd-tool-sheet .hd-tool-desc{font-size:11.5px;line-height:1.35}.hd-tool-go{width:22px;height:22px}.hd-tool-go svg{width:12px;height:12px}}.hd-tool-stacked{border-radius:16px;gap:10px;padding:6px 6px 12px}.hd-tool-frame{aspect-ratio:4/3;background:var(--surface);border-radius:11px;width:100%;display:block;position:relative;overflow:hidden}.hd-tool-stacked .hd-tool-plate{border-radius:0;width:100%;height:100%}.hd-tool-stacked .hd-tool-plate svg{width:26px;height:26px}.hd-tool-stacked .hd-tool-txt{gap:3px;padding:0 6px}.hd-tool-stacked .hd-tool-name{letter-spacing:-.01em;font-size:14px}.hd-tool-stacked .hd-tool-desc{-webkit-line-clamp:3;font-size:12.5px;line-height:1.4}.hd-tool-stacked:hover:not(:disabled) .hd-tool-media img{transform:scale(1.04)}@media (prefers-reduced-motion:reduce){.hd-tool-media img,.hd-tool-sheet,.hd-tool-cap{transition:none}.hd-tool[data-media]:hover:not(:disabled) .hd-tool-media img,.hd-tool-stacked:hover:not(:disabled) .hd-tool-media img{transform:none}.hd-tool{transition-property:opacity;transition-duration:.15s}.hd-tool:hover:not(:disabled){transform:none}}
