.comments-layout{position:relative}.comments-thread{padding-bottom:12px}.comment-compose{position:relative;bottom:auto;z-index:6;align-self:stretch;border:1px solid var(--site-tone-5e4055, #5e4043);border-radius:14px;background:linear-gradient(115deg,var(--site-tone-1d111deb, #1d1112eb),var(--site-tone-07070bf2, #0b0707f2));box-shadow:0 10px 40px #0009;overflow-anchor:none}.comment-compose.is-sticky{position:sticky;bottom:14px}.comment-compose-toggle{width:100%;border:0;background:transparent;padding:14px 20px;justify-content:center}.comment-compose-toggle:hover{background:var(--site-tone-40203644, #40202344)}.comment-compose-body{max-height:none;overflow:visible;overscroll-behavior:auto}.comment-compose-body .comment-composer{margin:0;border:0;border-radius:0;background:transparent;padding:20px 26px}.comment-compose[open]{z-index:8}.project-comments{overflow-anchor:none}.comment-reaction[hidden]{display:none!important}.reaction-picker{position:relative}.reaction-picker summary{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--site-tone-4c3c53, #533c3e);background:var(--site-tone-180f1b88, #1b0f1088);border-radius:50%;color:var(--site-tone-c3a9c6, #c6a9ac);cursor:pointer;list-style:none}.reaction-picker summary::-webkit-details-marker{display:none}.reaction-picker summary svg{width:21px;height:21px}.reaction-picker summary:is(:hover,:focus-visible){border-color:var(--site-tone-d098b9, #d0989e);color:var(--site-tone-f4c7e0, #f4c7cc)}.reaction-picker-menu{position:absolute;bottom:calc(100% + 10px);left:0;z-index:10;display:flex;gap:4px;padding:9px;border:1px solid var(--site-tone-79617d, #7d6164);border-radius:16px;background:var(--site-tone-120c16f5, #160c0df5);box-shadow:0 8px 28px #000a;width:max-content;max-width:calc(100vw - 24px)}.reaction-picker-menu button{display:flex;justify-content:center;align-items:center;flex:none;width:33px;height:38px;border:0;border-radius:9px;background:transparent;font-size:22px;cursor:pointer;transition:background .2s,transform .2s}.reaction-picker-menu button:hover{background:var(--site-tone-643a6144, #643a3e44);transform:translateY(-3px)}.reaction-picker-menu button[aria-pressed=true]{background:var(--site-tone-7d477377, #7d474c77)}.reaction-picker[open] .reaction-picker-menu{animation:reaction-menu-in .18s ease-out}.comment-rating-choice{position:relative;grid-column:1;align-self:center;max-width:290px;margin:0 0 12px}.comment-rating-choice summary{display:flex;align-items:center;gap:10px;font-size:11px;padding:10px 12px;border:1px solid var(--site-tone-73526a, #735255);border-radius:9px;color:var(--site-tone-d7bad1, #d7babd);background:var(--site-tone-29122544, #29121444);cursor:pointer;list-style:none}.comment-rating-choice summary::-webkit-details-marker{display:none}.comment-rating-choice summary strong{font-size:11px;color:var(--site-tone-eabbda, #eabbc0);font-weight:400;white-space:nowrap}.comment-rating-choice summary>span{margin-left:auto}.comment-rating-options{position:absolute;bottom:calc(100% + 8px);left:0;width:260px;max-width:calc(100vw - 84px);padding:16px;z-index:12;border:1px solid var(--site-tone-79556e, #795559);border-radius:12px;background:var(--site-tone-130c18f5, #180c0df5);box-shadow:0 10px 30px #000b}.comment-rating-options fieldset{border:0;margin:0;padding:0}.comment-rating-options legend{float:none;font-size:11px;width:auto;margin-bottom:12px;color:var(--site-tone-d5b7d0, #d5b7ba)}.comment-no-rating{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--site-tone-c5b0c4, #c5b0b2);margin-top:12px;cursor:pointer}.comment-no-rating input{accent-color:var(--site-tone-d98ebc, #d98e95)}.news-reaction-block{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:30px 0;padding:20px 24px;border:1px solid var(--site-tone-4b3547, #4b3537);border-radius:14px;background:var(--site-tone-160d1888, #180d0e88)}.news-reaction-block>p{font-size:13px;color:var(--site-tone-d4bdcf, #d4bdbf);margin:0}.news-reaction-block .comment-reactions{margin:0}.player-rating-row{display:flex;align-items:center;margin:24px 0}.player-rating-row .project-rating-aside{width:244px}.comment-reactions:has(.reaction-picker[open]){position:relative;z-index:12}.project-comment:has(.reaction-picker[open]){position:relative;z-index:9}@keyframes reaction-menu-in{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:none}}@media(max-width:575px){.comment-compose.is-sticky{bottom:10px}.comment-compose-body .comment-composer{padding:18px}.comment-rating-choice{grid-column:1/-1;max-width:none}.comment-rating-options{max-width:calc(100vw - 76px)}.reaction-picker-menu{gap:2px;padding:7px}.reaction-picker-menu button{width:30px}.news-reaction-block{padding:18px}.comment-reaction{min-width:48px;padding:4px 8px;gap:5px}.comment-compose-toggle{font-size:12px;padding:13px}}@media(prefers-reduced-motion:reduce){.reaction-picker[open] .reaction-picker-menu{animation:none}.reaction-picker-menu button{transition:none}}


.comment-compose.is-animating .comment-compose-body{overflow:hidden}
.comment-compose-body .comment-composer{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.reveal-ready .comment-compose.is-sticky.page-reveal{opacity:1;transform:none;transition:none}
/* Preserve the translucent surface, hiding only discussion content behind it. */
.project-comments .comment-compose,.project-comments .project-comment.content-block,.project-comments .comments-empty.content-block{background:linear-gradient(130deg,rgba(25,20,29,.45),rgba(2,2,4,.66))}
.project-comments .comment-compose{backdrop-filter:blur(28px) saturate(.7);-webkit-backdrop-filter:blur(28px) saturate(.7);box-shadow:0 10px 40px #0009}
body:not(.may-player-route) .project-comments .comment-compose{border-color:#34303c}
.comments-thread.is-covered-by-composer{clip-path:inset(-100vmax -100vmax var(--comment-covered-height) -100vmax)}
.comment-side-column.is-sticky{position:sticky;bottom:var(--comment-bottom-inset,14px);z-index:6}
.comment-side-column>.comment-compose.is-sticky{position:relative;bottom:auto}
.comment-side-column:has(.comment-compose[open]){z-index:8}
@media(max-width:767px){.comment-side-column.is-sticky{bottom:var(--comment-bottom-inset,calc(75px + env(safe-area-inset-bottom,0px)))}}
/* Mobile keeps the docked editor opaque instead of clipping a moving thread
   behind a blurred layer, which can leave seams while scrolling. */
@media(max-width:767px){.project-comments .comment-compose{background:var(--site-tone-080809,#090808);backdrop-filter:none;-webkit-backdrop-filter:none}.comments-thread.is-covered-by-composer{clip-path:none}}
@media(max-width:767px){
    .project-comments .comment-side-column{border:1px solid var(--site-tone-34303c,#3c3031);border-radius:14px;background:var(--site-tone-080809,#090808);box-shadow:0 10px 30px #0008}
    .comment-side-column>.comments-controls{margin:0}
    .comment-side-column>.comments-controls>.comments-filters{border:0;border-radius:13px 13px 0 0;background:transparent}
    .project-comments .comment-side-column>.comment-compose{border:0;border-top:1px solid #ffffff12;border-radius:0 0 13px 13px;background:transparent;box-shadow:none}
    .comment-side-column .comments-list-status:not(.visually-hidden){margin:0;padding:0 14px 12px}
}
.project-comments .comment-compose[open]>.comment-compose-toggle{border-bottom:1px solid #ffffff12;border-radius:13px 13px 0 0;background-color:#ffffff03}
@supports not ((backdrop-filter:blur(28px)) or (-webkit-backdrop-filter:blur(28px))){.project-comments .comment-compose,body:not(.may-player-route) .project-comments .comment-compose{background-color:#08070b}}

/* Filters and the disclosure button share one dock bar; each remains an
   independent control, so changing a filter never toggles the editor. */
.project-comments .comment-side-column{border:1px solid var(--site-tone-34303c,#3c3031);border-radius:14px;background:var(--site-tone-080809,#090808);box-shadow:0 10px 30px #0008}
.comment-dock-header{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;padding:8px 14px;margin:0}
.comment-dock-header>.comments-filters{flex:1 1 460px;display:grid;grid-template-columns:minmax(0,190px) minmax(0,215px) minmax(0,1fr);gap:12px;padding:0;margin:0;border:0;border-radius:0;background:transparent}
.comment-dock-header>.comments-filters[hidden]{display:none}
.comment-dock-header>.comments-filters label{position:relative}
.comment-dock-header>.comments-filters label>span:not(.mgn-select){position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}
.comment-dock-header .comments-filter-count{padding:0;align-self:center;white-space:nowrap}
.comment-dock-header>.comments-list-status:not(.visually-hidden){flex:0 0 100%;margin:0;padding:0 0 4px}
.comment-compose-bar-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:none;min-height:44px;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:var(--site-tone-d7bad1,#d7babd);font:inherit;font-size:13px;cursor:pointer;transition:background-color .18s,color .18s}
.comment-compose-bar-button[hidden]{display:none}
.comment-compose-bar-button>svg{width:20px;height:20px;flex:none}
.comment-compose-bar-button>.comment-compose-chevron{width:14px;height:14px}
.comment-compose-bar-button[aria-expanded=true]>.comment-compose-chevron{transform:rotate(180deg)}
.comment-compose-bar-button:is(:hover,:focus-visible){background:#ffffff07;color:#ffd3d7}
.comment-compose-bar-button:focus-visible{outline:2px solid #fc8194;outline-offset:2px}
.comment-side-column.has-toolbar-toggle>.comment-compose>.comment-compose-toggle{display:none}
.comment-side-column:not(:has(>.comment-compose)) [data-comment-compose-button]{display:none}
.project-comments .comment-side-column>.comment-compose{border:0;border-radius:0 0 13px 13px;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.comment-side-column.has-toolbar-toggle>.comment-compose[open]{border-top:1px solid #ffffff12}
@media(max-width:767px){
    .comment-dock-header{gap:8px;padding:8px 12px}
    .comment-dock-header>.comment-compose-bar-button{order:-1;width:100%;font-size:12px;min-height:40px}
    .comment-dock-header>.comments-filters{flex-basis:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
    .comment-dock-header .comments-filter-count{grid-column:1/-1;padding:2px 0 4px;border:0;text-align:center}
}
@media(max-width:359px){.comment-dock-header>.comments-filters{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.comment-compose-bar-button{transition:none}}
