.feedback-page{
    --fb-surface:var(--surface,#0a1325);
    --fb-surface2:var(--surface2,#111d36);
    --fb-line:var(--line,rgba(255,255,255,.075));
    --fb-text:var(--text,#f7fafc);
    --fb-muted:var(--muted,#91a3b7);
    --fb-accent:var(--cyan,#1de4bd);
    --fb-gold:var(--gold,#f8ce65);
    color:var(--fb-text)
}
.feedback-page *,
.feedback-page *::before,
.feedback-page *::after{
    box-sizing:border-box
}
.feedback-wrap{
    width:min(100% - 2rem,72rem);
    margin-inline:auto;
    padding-block:3.5rem 5rem
}
.feedback-hero{
    padding:2rem;
    border:.0625rem solid var(--fb-line);
    border-radius:1.5rem;
    background:
        radial-gradient(circle at 85% 15%,color-mix(in srgb,var(--fb-accent) 12%,transparent),transparent 35%),
        var(--fb-surface)
}
.feedback-kicker{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    color:var(--fb-accent);
    font-size:.9rem;
    font-weight:800
}
.feedback-title{
    margin:.8rem 0 0;
    font-size:clamp(2rem,4vw,3rem);
    line-height:1.55;
    font-weight:900
}
.feedback-description{
    max-width:48rem;
    margin:1rem 0 0;
    color:var(--fb-muted);
    font-size:1rem;
    line-height:2
}
.feedback-layout{
    display:grid;
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    gap:1.25rem;
    margin-top:1.5rem
}
.feedback-panel{
    padding:1.25rem;
    border:.0625rem solid var(--fb-line);
    border-radius:1.25rem;
    background:var(--fb-surface)
}
.feedback-panel h2{
    margin:0;
    font-size:1.25rem
}
.feedback-panel p{
    color:var(--fb-muted);
    font-size:.95rem;
    line-height:1.9
}
.feedback-form{
    display:grid;
    gap:1rem;
    margin-top:1rem
}
.feedback-form.is-disabled{
    opacity:.55;
    pointer-events:none
}
.feedback-field label{
    display:block;
    margin-bottom:.4rem;
    font-size:.9rem;
    font-weight:800
}
.feedback-field select,
.feedback-field textarea{
    width:100%;
    padding:.75rem .85rem;
    border:.0625rem solid var(--fb-line);
    border-radius:.85rem;
    outline:0;
    color:var(--fb-text);
    background:var(--fb-surface2);
    font:inherit;
    font-size:.95rem
}
.feedback-field textarea{
    min-height:9rem;
    resize:vertical;
    line-height:1.9
}
.feedback-submit{
    min-height:3rem;
    padding:.65rem 1rem;
    border:0;
    border-radius:.85rem;
    color:#03120f;
    background:var(--fb-accent);
    font:inherit;
    font-size:.95rem;
    font-weight:900;
    cursor:pointer
}
.feedback-message,
.feedback-login-note{
    display:flex;
    gap:.6rem;
    align-items:flex-start;
    margin-bottom:1rem;
    padding:.85rem 1rem;
    border:.0625rem solid var(--fb-line);
    border-radius:.9rem;
    font-size:.9rem;
    line-height:1.8
}
.feedback-message.is-success{
    color:#6ee7b7;
    background:rgba(52,211,153,.06)
}
.feedback-message.is-error{
    color:#fda4af;
    background:rgba(251,113,133,.06)
}
.feedback-message svg,
.feedback-login-note svg{
    flex:0 0 auto;
    width:1rem;
    height:1rem;
    margin-top:.2rem
}
.feedback-login-note a{
    display:block;
    margin-top:.25rem;
    color:var(--fb-accent);
    font-weight:800
}
.feedback-cards{
    display:grid;
    gap:.8rem
}
.feedback-empty{
    display:flex;
    min-height:10rem;
    align-items:center;
    justify-content:center;
    gap:.55rem;
    border:.0625rem dashed var(--fb-line);
    border-radius:1rem;
    color:var(--fb-muted);
    font-size:.95rem
}
@media(max-width:54rem){
    .feedback-layout{
        grid-template-columns:1fr
    }
}
@media(max-width:42rem){
    .feedback-wrap{
        width:min(100% - 1.25rem,72rem);
        padding-top:2.25rem
    }
}
