.feedback-page {
    min-height:100vh;
    background:#f5f5f5;
    padding:18px 0 48px;
}
.feedback-shell {
    display:grid;
    gap:12px;
}
.feedback-head {
    display:flex;
    min-height:88px;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border:1px solid #e4e8ed;
    border-radius:6px;
    background:#fff;
    padding:15px 18px;
}
.feedback-head-main {
    display:flex;
    min-width:0;
    flex:1 1 auto;
    align-items:center;
    gap:13px;
}
.feedback-head-icon {
    display:inline-flex;
    width:44px;
    height:44px;
    flex:0 0 44px;
    align-items:center;
    justify-content:center;
    border-radius:6px;
    background:#eff6ff;
    color:#2563eb;
    font-size:24px;
}
.feedback-head-copy {
    min-width:0;
    flex:1 1 auto;
}
.feedback-head-copy>span {
    display:block;
    color:#2563eb;
    font-size:12px;
    font-weight:500;
    line-height:18px;
}
.feedback-head-copy h1 {
    margin:1px 0 0;
    color:#172033;
    font-size:20px;
    font-weight:600;
    line-height:27px;
}
.feedback-head-copy p {
    overflow:hidden;
    margin:2px 0 0;
    color:#7b8798;
    font-size:12px;
    line-height:18px;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.feedback-head-note {
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    gap:5px;
    color:#94a3b8;
    font-size:12px;
    line-height:20px;
    white-space:nowrap;
}
.feedback-head-note i {
    color:#3b82f6;
    font-size:16px;
}
.feedback-comments {
    min-width:0;
    max-width:100%;
    scroll-margin-top:96px;
}
html.dark .feedback-page,
html.tw-dark .feedback-page {
    background:#101010;
}
html.dark .feedback-head,
html.tw-dark .feedback-head {
    border-color:#2a2a2a;
    background:#1d1e1f;
}
html.dark .feedback-head-icon,
html.tw-dark .feedback-head-icon {
    background:rgba(56,189,248,.1);
    color:#7dd3fc;
}
html.dark .feedback-head-copy>span,
html.tw-dark .feedback-head-copy>span,
html.dark .feedback-head-note i,
html.tw-dark .feedback-head-note i {
    color:#7dd3fc;
}
html.dark .feedback-head-copy h1,
html.tw-dark .feedback-head-copy h1 {
    color:#f2f2f2;
}
html.dark .feedback-head-copy p,
html.tw-dark .feedback-head-copy p,
html.dark .feedback-head-note,
html.tw-dark .feedback-head-note {
    color:#b5b6b2;
}
@media (max-width:720px) {
    .feedback-page { padding:12px 0 32px; }
    .feedback-head { padding:14px; }
    .feedback-head-icon {
        width:40px;
        height:40px;
        flex-basis:40px;
        font-size:22px;
    }
    .feedback-head-note { display:none; }
}
