.date-feedback{border:1px solid var(--line-subtle);max-width:880px;margin:36px 0 52px}.feedback-heading{justify-content:space-between;align-items:center;gap:24px;display:flex}.date-feedback .feedback-heading h2{margin:0}body .date-feedback .feedback-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0;display:grid}body .date-feedback .date-reaction{background:var(--surface-subtle);min-width:0;min-height:172px;color:var(--ink);opacity:1;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:0;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:12px 8px 16px;display:flex;position:relative}body .date-feedback .date-reaction[aria-pressed=true]{background:var(--surface-hover);color:var(--ink)}.date-reaction:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.date-reaction-art{flex-shrink:0;width:96px;height:96px;display:block;overflow:visible}.date-reaction-label{white-space:nowrap}body .date-feedback .date-reaction-count{color:var(--text-muted);font-size:var(--type-meta-size);line-height:var(--type-meta-line);font-weight:var(--weight-regular);white-space:nowrap;margin:0}.date-reaction-check{background:var(--ink);width:22px;height:22px;color:var(--paper);opacity:0;border-radius:50%;justify-content:center;align-items:center;transition:opacity .12s linear;display:flex;position:absolute;top:12px;right:12px}.date-reaction[aria-pressed=true] .date-reaction-check{opacity:1}.reaction-object{transform-box:fill-box;transform-origin:50% 85%;transition:transform .28s cubic-bezier(.22,1.4,.36,1)}.reaction-face,.reaction-leaves,.reaction-mouth{transform-box:fill-box;transform-origin:50%;transition:transform .22s cubic-bezier(.22,1,.36,1)}.reaction-extra{opacity:0;transform-box:fill-box;transform-origin:50%;transition:transform .24s cubic-bezier(.22,1.4,.36,1),opacity .12s linear;transform:scale(.9)}.date-reaction--super .reaction-object{transform:rotate(-8deg)}.date-reaction--okay .reaction-object{transform:rotate(5deg)}.date-reaction--nope .reaction-object{transform:rotate(-5deg)}.date-reaction--super[data-engaged=true] .reaction-object{transform:translateY(-4px)rotate(0)scale(1.05)}.date-reaction--okay[data-engaged=true] .reaction-object{transform:rotate(-7deg)}.date-reaction--okay[data-engaged=true] .reaction-face{transform:translate(3px)}.date-reaction--nope[data-engaged=true] .reaction-object{transform:translateY(4px)rotate(3deg)scale(1.12,.82)}.date-reaction[data-engaged=true] .reaction-extra{opacity:1;transform:scale(1)}@media (hover:hover) and (pointer:fine){body .date-feedback .date-reaction:not(:disabled):hover{background:var(--surface-hover)}.feedback-options:not([data-keyboard=true]) .date-reaction--super:not(:disabled):hover .reaction-object{transform:translateY(-5px)rotate(3deg)scale(1.08)}.feedback-options:not([data-keyboard=true]) .date-reaction--okay:not(:disabled):hover .reaction-object{transform:rotate(-8deg)}.feedback-options:not([data-keyboard=true]) .date-reaction--okay:not(:disabled):hover .reaction-face{transform:translate(3px)}.feedback-options:not([data-keyboard=true]) .date-reaction--nope:not(:disabled):hover .reaction-object{transform:translateY(3px)rotate(6deg)scale(1.08,.9)}.feedback-options:not([data-keyboard=true]) .date-reaction:not(:disabled):hover .reaction-extra{opacity:1;transform:scale(1)}.feedback-meta button:hover{color:var(--ink)}}.feedback-options:not([data-keyboard=true]) .date-reaction:not(:disabled):active .reaction-object{transition-duration:80ms;transition-timing-function:cubic-bezier(.22,1,.36,1);transform:translateY(5px)scale(.96,.86)}.feedback-options:not([data-keyboard=true]) .date-reaction--nope:not(:disabled):active .reaction-object{transform:translateY(8px)scale(1.16,.72)}.feedback-options[data-keyboard=true] :is(.reaction-object,.reaction-face,.reaction-extra,.reaction-leaves,.reaction-mouth){transition:none}.feedback-distribution{gap:10px;margin:24px 0;display:grid}.feedback-distribution>div{color:var(--text-muted);grid-template-columns:85px 1fr 40px;align-items:center;gap:12px;display:grid}.feedback-distribution>div>span:last-child{text-align:right;font-variant-numeric:tabular-nums}.feedback-track{border-radius:var(--radius);background:var(--surface-subtle);height:5px;overflow:hidden}.feedback-fill{transform-origin:0;background:#e854a0;width:100%;height:100%;transition:transform .24s cubic-bezier(.22,1,.36,1);display:block}.feedback-fill.okay{background:#deb135}.feedback-fill.nope{background:#ea5a49}.feedback-meta{color:var(--text-muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.feedback-meta button{text-underline-offset:3px;color:var(--text-muted);background:0 0;border:0;min-height:44px;padding:0;text-decoration:underline}.feedback-status{color:var(--text-muted);margin-top:10px}.feedback-status:empty{margin:0}@media (max-width:760px){.date-feedback{margin:26px 0 36px}.feedback-heading{align-items:start;gap:12px}body .date-feedback .feedback-options{gap:8px}body .date-feedback .date-reaction{border-radius:16px;min-height:148px;padding:12px 4px}.date-reaction-art{width:76px;max-width:100%;height:76px}.date-reaction-check{width:18px;height:18px;top:7px;right:7px}.date-reaction-check svg{width:12px;height:12px}.feedback-distribution>div{grid-template-columns:70px 1fr 34px;gap:10px}}@media (prefers-reduced-motion:reduce){.date-feedback :is(.reaction-object,.reaction-face,.reaction-leaves,.reaction-mouth,.reaction-extra,.feedback-fill){transition:none}.date-feedback :is(.reaction-object,.reaction-face,.reaction-leaves,.reaction-mouth,.reaction-extra){transform:none!important}.date-reaction-check{transition:opacity .1s linear}}