.delete-confirmation{width:91%;min-width:345px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:100;display:grid;gap:23px}.delete-confirmation p#delete-title{color:var(--neutral-900);font-size:1.21rem}.delete-confirmation p{line-height:1.5;font-family:var(--font-family)}.delete-confirmation p:not(#delete-title){color:var(--neutral-400)}.actions{display:flex;gap:12px;justify-content:space-between}.actions button{padding-inline:23px!important}.actions .grey-btn{background:var(--neutral-900)}.actions .grey-btn:hover{background:var(--neutral-400)}.actions .red-btn{background:var(--primary-red)}.actions .red-btn:hover{background:var(--red-hover)}.hidden-dialog{visibility:hidden;opacity:0;transition:opacity 1s ease-in-out}.visible-dialog{visibility:visible;opacity:1}@media (width >= 769px){.delete-confirmation{width:27.7%}}:root{--primary-default: hsl(238, 40%, 52%);--primary-red: hsl(358, 79%, 66%);--default-hover: hsl(239, 57%, 85%);--red-hover: hsl(357, 100%, 86%);--neutral-900: hsl(212, 24%, 26%);--neutral-400: hsl(211, 10%, 45%);--neutral-300: hsl(223, 19%, 93%);--neutral-200: hsl(228, 33%, 97%);--neutral-100: hsl(0, 0%, 100%);--body-font-size: 1rem;--font-family: "Rubik", sans-serif;--normal-wght: 400;--semibold-wght: 500;--bold-wght: 700}body{background:var(--neutral-200)}strong{font-weight:700}.card{padding:16px;border-radius:8px;background:var(--neutral-100)}.solid-btn{padding:15px 30px;border-radius:8px;background:var(--primary-default);color:var(--neutral-100)!important;font-size:var(--body-font-size);font-weight:var(--bold-wght);font-family:var(--font-family)}.solid-btn:hover{background:var(--default-hover)}.solid-btn:disabled{background:var(--default-hover)}.mini-btn{display:flex;align-items:center}.mini-btn svg{margin-right:8px}.mini-btn:hover{color:var(--default-hover)}.mini-btn:hover svg{fill:var(--default-hover)}.delete-btn{color:var(--primary-red)!important}.delete-btn:hover{color:var(--red-hover)!important}.delete-btn:hover svg{fill:var(--red-hover)!important}form textarea{padding:12px 18px;border:1px solid var(--neutral-400);border-radius:8px;min-height:94px;color:var(--neutral-400);background:var(--neutral-100);font-size:1rem;font-family:Rubik,sans-serif}.hidden-form{display:none}.img-wrapper{width:32px;aspect-ratio:1 / 1}.img-wrapper img{-webkit-user-select:none;user-select:none;pointer-events:none}.replyingTo{font-weight:500;color:var(--primary-default)}.username{display:flex;gap:8px;align-items:center}.username>a{font-size:1rem;font-weight:var(--semibold-wght);font-family:var(--font-family);color:var(--neutral-900)}.username>a:hover{color:var(--neutral-400)}.username span{padding:2px 6px;border-radius:3px;color:var(--neutral-100);background:var(--primary-default);font-size:.8rem;font-weight:500;font-family:var(--font-family);-webkit-user-select:none;user-select:none}dialog{border:0}button:hover{cursor:pointer}.mini-btn-wrapper{display:flex;align-items:center}.hidden{position:absolute;width:1px;height:1px;font-size:0;overflow:hidden}@media (width >= 600px){.card{padding:22px}}*{padding:0;margin:0;font:inherit}*,*:before,*:after{box-sizing:border-box}body{min-height:100dvh}ul{list-style:none}a{text-decoration:none}textarea,button{border:none;background-color:transparent}textarea{resize:none}img,svg,picture{display:block;max-width:100%}.comment-list{margin:32px auto;width:91%}.comment-list>div,.reply-list>div{display:grid;gap:16px}.comment-list>div:not(:last-child),.reply-list>div:not(:last-child){margin-bottom:16px}.comment-wrapper{display:grid;row-gap:8px}.comment{display:grid;row-gap:20px;grid-template-rows:1fr;grid-template-columns:1fr auto;grid-template-areas:"comment-info comment-info" "comment comment" "scores comment-operation"}.comment-content{grid-area:comment}.comment-content>p{font-size:1rem;line-height:1.5;font-family:var(--font-family);color:var(--neutral-400)}.comment-info{display:flex;align-items:center;column-gap:1rem;grid-area:comment-info}.comment-info time{font-size:1rem;font-family:var(--font-family);color:var(--neutral-400)}.comment-section{margin-bottom:32px}.scores{grid-area:scores;display:flex;align-items:center;width:fit-content;height:fit-content;min-width:11px;border-radius:10px;background:var(--neutral-200)}.scores>*{font-family:var(--font-family)}.scores span{font-weight:var(--semibold-wght);color:var(--primary-default);-webkit-user-select:none;user-select:none}.scores button{height:39px;padding:14px}.scores button:hover svg{fill:var(--primary-default)}.comment-operations{grid-area:comment-operation;display:flex;column-gap:16px;overflow-x:auto}.comment-operations button{color:var(--primary-default);font-weight:var(--semibold-wght);font-family:var(--font-family)}.reply-list-wrapper{display:grid;grid-template-columns:4.8% 1fr;grid-template-areas:"space list"}.reply-list{grid-area:list}.reply-left-space{grid-area:space}@media (width >= 600px){.comment-list{width:585px}.comment{column-gap:22px;grid-template-rows:1fr;grid-template-columns:auto 1fr auto;grid-template-areas:"scores comment-info comment-operation" "scores comment comment"}.comment-section{margin-bottom:64px}.small-date time{font-size:clamp(.5rem,1.6svw,1rem);white-space:nowrap}.scores{flex-direction:column}.scores button{height:46px}.scores button:first-child{padding-bottom:21px}.scores button:last-child{padding-top:21px}.comment-operations{margin-left:-12px}.reply-list-wrapper{grid-template-columns:12% 1fr}.reply-left-space{min-width:12%;display:grid;justify-content:center}.reply-left-space:before{content:"";display:block;width:2px;height:100%;background-color:var(--neutral-300)}}@media (width >= 1025px){.comment-list{width:51.8%}}.user-comment-input{position:sticky;bottom:32px;width:91%;margin-inline:auto}.user-comment-input form{display:grid;align-items:center;grid-template-columns:1fr auto;grid-template-rows:auto;grid-template-areas:"textarea textarea" "photo button";row-gap:14px}.user-comment-input form>div{grid-area:photo}.user-comment-input form textarea{grid-area:textarea}.user-comment-input form button{grid-area:button}@media (width >= 600px){.user-comment-input{width:585px}.user-comment-input form{align-items:start;grid-template-columns:auto 1fr auto;grid-template-areas:"photo textarea button";column-gap:clamp(5px,2%,16px)}}@media (width >= 1025px){.user-comment-input{width:51.8%}}.reply-form{display:grid;grid-template-columns:auto 1fr;gap:16px}.reply-form form{display:flex;flex-direction:column;gap:16px}.reply-form form button{place-self:end}.edit-form{width:100%}.edit-form form{display:flex;flex-direction:column;gap:16px}.edit-form form button{place-self:end}
