/* Guest support pages. Loaded after auth.css. */
.authPanel textarea,
.authPanel select {
    width: 100%;
    border-radius: var(--lp-radius);
    border: 1px solid var(--lp-line);
    background: oklch(0.125 0.006 270 / .85);
    padding: 12px 14px;
    color: var(--lp-ink);
    font: inherit;
    outline: none;
}
.authPanel select { height: 48px; }
.authPanel textarea:focus,
.authPanel select:focus {
    border-color: oklch(0.65 0.2 275 / .55);
    box-shadow: 0 0 0 3px oklch(0.65 0.2 275 / .18);
}
.topicGrid { display: grid; gap: 8px; }
.topicBtn {
    display: flex; flex-direction: column; gap: 2px; align-items: flex-start;
    width: 100%; text-align: left;
    padding: 10px 12px;
    border-radius: var(--lp-radius);
    border: 1px solid var(--lp-line);
    background: oklch(1 0 0 / 3%);
    color: var(--lp-ink);
}
.topicBtn[aria-selected="true"] { border-color: oklch(0.65 0.2 275 / .7); background: oklch(0.65 0.2 275 / .14); }
.topicBtn b { display: block; font-size: .92rem; }
.topicBtn small { display: block; color: var(--lp-faint); font-size: .8rem; font-weight: 500; }
.guestMsg {
    white-space: pre-wrap;
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: var(--lp-radius);
    background: oklch(1 0 0 / 4%);
}
.guestMsg.staff { background: oklch(0.65 0.2 275 / .12); }
.authStage .authPanel { max-width: 640px; }