[data-slot=template-dot]{--td-radius:9999px;border-radius:var(--td-radius);background:var(--brand-blue-soft);color:var(--brand-blue);cursor:pointer;flex:none;place-items:center;display:grid;position:relative}button[data-slot=template-dot]{pointer-events:auto}span[data-slot=template-dot]{cursor:default;pointer-events:none}[data-slot=template-dot][data-size=disc]{width:64px;height:64px}[data-slot=template-dot][data-size=card]{width:44px;height:44px}[data-slot=template-dot][data-photo=true]{--td-radius:12px;background:var(--canvas-deep);color:#fff}[data-slot=template-dot] .td-photo{border-radius:inherit;position:absolute;inset:0;overflow:hidden}[data-slot=template-dot] .td-photo img{object-fit:contain;filter:blur(1.2px);width:100%;height:100%;display:block}[data-slot=template-dot] .td-photo:after{content:"";background:#0a12303d;position:absolute;inset:0}[data-slot=template-dot] .td-mark{width:17px;height:17px;margin-left:2px;position:relative}[data-slot=template-dot][data-size=disc] .td-mark{width:22px;height:22px;margin-left:3px}[data-slot=template-dot] .td-pause{border:0 solid;border-width:0 3px;width:10px;height:11px;display:none;position:relative}[data-slot=template-dot][data-size=disc] .td-pause{border-width:0 4.5px;width:14px;height:16px}[data-slot=template-dot][data-playing=true]{background:var(--brand-pink-deep);color:#fff}[data-slot=template-dot][data-playing=true] .td-photo:after{background:color-mix(in srgb, var(--brand-pink-deep) 84%, transparent)}[data-slot=template-dot][data-playing=true] .td-mark{display:none}[data-slot=template-dot][data-playing=true] .td-pause{display:block}[data-slot=template-dot][data-playing=true]:before{border-radius:calc(var(--td-radius) + 5px);background:conic-gradient(var(--brand-pink-deep) calc(var(--p,0) * 1%), var(--brand-pink-soft) 0);-webkit-mask-composite:xor;content:"";padding:2.5px;position:absolute;inset:-5px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}[data-slot=template-dot][data-size=disc][data-selected=true]{box-shadow:0 0 0 2.5px var(--canvas), 0 0 0 5px var(--brand-blue)}button[data-slot=template-dot]:focus-visible{outline:3px solid color-mix(in srgb, var(--brand-blue) 50%, transparent);outline-offset:3px}