/* 协议 / 隐私 / 举报 三个法务页面共用样式 */
* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif;
    background: linear-gradient(to right, rgb(247, 209, 215), rgb(191, 227, 241));
    color: #2a3441;
    min-height: 100vh;
    padding-bottom: 60px;
}

.legal-header {
    max-width: 880px;
    margin: 0 auto;
    padding: 36px 24px 12px;
    position: relative;
}
.legal-header h1 {
    font-size: 28px;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, .12);
    letter-spacing: 4px;
}
.legal-header .back {
    color: white;
    text-decoration: none;
    font-size: 14px;
    opacity: .85;
}
.legal-header .back:hover { opacity: 1; text-decoration: underline; }

.legal-main {
    max-width: 880px;
    margin: 16px auto 0;
    padding: 32px 36px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    border-radius: 14px;
    box-shadow: 0 10px 36px rgba(0, 0, 0, .12);
    line-height: 1.85;
    font-size: 15px;
}
.legal-main .legal-meta {
    color: #888;
    font-size: 13px;
    border-bottom: 1px dashed #d6dde4;
    padding-bottom: 12px;
    margin-bottom: 20px;
}
.legal-main .legal-intro {
    background: #f5f9fc;
    border-left: 4px solid #69b3f0;
    padding: 14px 18px;
    border-radius: 6px;
    margin-bottom: 24px;
    color: #455;
}
.legal-main h2 {
    font-size: 18px;
    color: #2a3441;
    margin: 26px 0 10px;
    padding-left: 10px;
    border-left: 4px solid #f7a8b8;
}
.legal-main h3 {
    font-size: 15.5px;
    color: #3a4854;
    margin: 16px 0 6px;
}
.legal-main p { margin: 8px 0; }
.legal-main ol, .legal-main ul { margin: 8px 0 8px 30px; }
.legal-main li { margin: 4px 0; }
.legal-main a {
    color: #1d6fb8;
    text-decoration: none;
}
.legal-main a:hover { text-decoration: underline; }

/* 投诉举报表单 */
.report-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 12px;
}
.report-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 14px;
    color: #455;
}
.report-form .req { color: #d04646; margin-left: 2px; }
.report-form input[type=text],
.report-form input[type=email],
.report-form select,
.report-form textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d6dde4;
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    background: white;
    transition: border-color .15s;
}
.report-form input:focus,
.report-form select:focus,
.report-form textarea:focus {
    outline: none;
    border-color: #69b3f0;
    box-shadow: 0 0 0 3px rgba(105, 179, 240, .15);
}
.report-form textarea { resize: vertical; min-height: 110px; }
.report-form .hint { color: #888; font-size: 12px; }
.report-form .agree {
    font-size: 13px;
    color: #555;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.report-form .agree label {
    flex-direction: row;
    align-items: flex-start;
    gap: 8px;
}
.report-form .agree input[type=checkbox] {
    margin-top: 4px;
    flex-shrink: 0;
}
.report-form .primary-btn {
    align-self: flex-start;
    padding: 10px 28px;
    background: #69b3f0;
    color: white;
    border: none;
    border-radius: 22px;
    font-size: 14px;
    cursor: pointer;
    transition: opacity .15s;
}
.report-form .primary-btn:hover { opacity: .88; }
.report-form .primary-btn:disabled { opacity: .5; cursor: not-allowed; }

.result {
    margin-top: 18px;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.6;
}
.result.ok  { background: #e7f6ec; border: 1px solid #87c79c; color: #1d6e3a; }
.result.err { background: #fbeaea; border: 1px solid #d99595; color: #a72323; }
.result.hidden { display: none; }
.result code { background: rgba(0,0,0,.06); padding: 1px 6px; border-radius: 4px; }

@media (max-width: 720px) {
    .legal-header { padding: 24px 16px 8px; }
    .legal-main { padding: 22px 18px; margin: 12px; }
}