.qt-app {
    --qt-primary: #00854a;
    --qt-primary-dark: #006c3c;
    --qt-primary-soft: #e7f4ed;
    --qt-ink: #17352a;
    --qt-muted: #64766d;
    --qt-border: #d8e4dc;
    --qt-canvas: #f3f7f4;
    --qt-surface: #ffffff;
    --qt-orange: #c56a0a;
    --qt-orange-soft: #fff3df;
    --qt-red: #bc3f39;
    --qt-red-soft: #fdeceb;
    --qt-blue: #2f69b3;
    --qt-blue-soft: #eaf2fc;
    margin: 0;
    min-height: 100vh;
    color: var(--qt-ink);
    background: var(--qt-canvas);
    font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;
    line-height: 1.5;
}

.qt-app *,
.qt-app *::before,
.qt-app *::after {
    box-sizing: border-box;
}

.qt-app form {
    margin: 0;
}

.qt-app input,
.qt-app button,
.qt-app select,
.qt-app textarea {
    font: inherit;
}

.qt-app a {
    color: var(--qt-primary-dark);
    text-decoration: none;
}

.qt-shell {
    width: min(100%, 1180px);
    margin: 0 auto;
}

.qt-appbar {
    color: #ffffff;
    background: var(--qt-primary);
}

.qt-appbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 68px;
    padding: 10px 20px;
}

.qt-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.qt-brand-mark {
    display: inline-flex;
    flex: 0 0 40px;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 8px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
    font-size: 18px;
    font-weight: 500;
}

.qt-brand-copy {
    min-width: 0;
}

.qt-brand-title {
    display: block;
    overflow: hidden;
    font-size: 16px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qt-brand-subtitle {
    display: block;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qt-header-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
}

.qt-header-badge {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    font-size: 12px;
}

.qt-main {
    padding: 24px 20px 40px;
}

.qt-panel {
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-surface);
    box-shadow: 0 10px 30px rgba(23, 53, 42, 0.06);
}

.qt-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--qt-border);
    background: #fbfdfc;
}

.qt-page-head h1,
.qt-page-head h2 {
    margin: 0;
    color: var(--qt-ink);
    font-size: 19px;
    font-weight: 500;
    line-height: 1.35;
}

.qt-page-head p {
    margin: 4px 0 0;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-page-body {
    padding: 20px;
}

.qt-section {
    padding: 18px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-surface);
}

.qt-section + .qt-section {
    margin-top: 16px;
}

.qt-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.qt-section-head h2,
.qt-section-head h3 {
    margin: 0;
    color: var(--qt-ink);
    font-size: 16px;
    font-weight: 500;
}

.qt-section-head p {
    margin: 4px 0 0;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

.qt-field {
    min-width: 0;
}

.qt-field-full {
    grid-column: 1 / -1;
}

.qt-field > label,
.qt-field-label {
    display: block;
    margin-bottom: 6px;
    color: var(--qt-ink);
    font-size: 13px;
    font-weight: 500;
}

.qt-required {
    color: var(--qt-red);
}

.qt-input,
.qt-app .input,
.qt-app input[type="text"],
.qt-app input[type="password"],
.qt-app textarea {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    outline: 0;
    color: var(--qt-ink);
    background: var(--qt-surface);
}

.qt-app textarea {
    min-height: 88px;
    resize: vertical;
}

.qt-input:focus,
.qt-app .input:focus,
.qt-app input[type="text"]:focus,
.qt-app input[type="password"]:focus,
.qt-app textarea:focus {
    border-color: var(--qt-primary);
    box-shadow: 0 0 0 3px rgba(0, 133, 74, 0.12);
}

.qt-input[disabled],
.qt-app .input[disabled],
.qt-app input[type="text"][disabled],
.qt-app input[type="password"][disabled],
.qt-app textarea[disabled] {
    color: var(--qt-muted);
    background: var(--qt-canvas);
}

.qt-field-help {
    display: block;
    margin-top: 5px;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-field-state {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    margin-left: 7px;
    padding: 2px 7px;
    border-radius: 999px;
    color: var(--qt-muted);
    background: #eef2ef;
    font-size: 11px;
    font-weight: 400;
    vertical-align: middle;
}

.qt-field-state.is-agent {
    color: var(--qt-primary-dark);
    background: var(--qt-primary-soft);
}

.qt-field-state.is-locked {
    color: #52645a;
    background: #e8ece9;
}

.qt-app .qt-input.is-readonly,
.qt-app .qt-input[readonly],
.qt-app .qt-input[disabled] {
    border-color: #aebbb3;
    color: #42564a;
    background: #dfe6e1;
    box-shadow: inset 0 1px 2px rgba(23, 53, 42, 0.08);
    cursor: not-allowed;
}

.qt-readonly-value {
    display: flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    padding: 9px 11px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    color: var(--qt-muted);
    background: var(--qt-canvas);
    font-size: 14px;
}

.qt-btn,
.qt-app input[type="submit"],
.qt-app input[type="button"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 8px 15px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    color: var(--qt-ink);
    background: var(--qt-surface);
    cursor: pointer;
}

.qt-btn-primary,
.qt-app input[type="submit"].qt-btn-primary {
    border-color: var(--qt-primary);
    color: #ffffff;
    background: var(--qt-primary);
}

.qt-app a.qt-btn-primary,
.qt-app a.qt-btn-primary:visited {
    border-color: var(--qt-primary);
    color: #ffffff;
    background: var(--qt-primary);
}

.qt-btn-primary:hover,
.qt-app input[type="submit"].qt-btn-primary:hover,
.qt-app a.qt-btn-primary:hover {
    color: #ffffff;
    background: var(--qt-primary-dark);
}

.qt-btn-secondary,
.qt-app a.qt-btn-secondary,
.qt-app input[type="button"].qt-btn-secondary {
    border-color: transparent;
    color: var(--qt-primary-dark);
    background: var(--qt-primary-soft);
}

.qt-btn-danger {
    border-color: transparent;
    color: var(--qt-red);
    background: var(--qt-red-soft);
}

.qt-btn-small {
    min-height: 32px;
    padding: 5px 10px;
    font-size: 12px;
}

.qt-view-button {
    min-height: 34px;
    padding: 5px 10px;
}

.qt-view-button::before {
    display: inline-block;
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
    content: "";
}

.qt-print-button::before {
    display: inline-block;
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 9V3h12v6'/%3E%3Crect x='6' y='14' width='12' height='8' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 9V3h12v6'/%3E%3Crect x='6' y='14' width='12' height='8' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
    content: "";
}

.qt-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.qt-help {
    margin-top: 14px;
    padding: 11px 13px;
    border-left: 3px solid var(--qt-primary);
    color: var(--qt-muted);
    background: var(--qt-primary-soft);
    font-size: 12px;
}

.qt-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 9px;
    border-radius: 999px;
    color: var(--qt-primary-dark);
    background: var(--qt-primary-soft);
    font-size: 12px;
    white-space: nowrap;
}

.qt-badge-warning {
    color: var(--qt-orange);
    background: var(--qt-orange-soft);
}

.qt-badge-danger {
    color: var(--qt-red);
    background: var(--qt-red-soft);
}

.qt-badge-info {
    color: var(--qt-blue);
    background: var(--qt-blue-soft);
}

.qt-public-main {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
    min-height: 620px;
}

.qt-public-intro {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 34px;
    color: #ffffff;
    background: var(--qt-primary);
}

.qt-public-intro h1 {
    margin: 18px 0 10px;
    color: #ffffff;
    font-size: 29px;
    font-weight: 500;
    line-height: 1.35;
}

.qt-public-intro p {
    margin: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 14px;
}

.qt-public-kicker {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.94);
    font-size: 12px;
}

.qt-process {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.qt-process li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 13px;
}

.qt-process-step {
    display: inline-flex;
    flex: 0 0 25px;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border: 1px solid rgba(255, 255, 255, 0.44);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    font-size: 12px;
}

.qt-public-panel {
    padding: 32px;
}

.qt-public-panel h2 {
    margin: 0 0 6px;
    font-size: 20px;
    font-weight: 500;
}

.qt-public-panel > p {
    margin: 0 0 20px;
    color: var(--qt-muted);
    font-size: 13px;
}

.qt-wx-box {
    display: flex;
    min-height: 360px;
    align-items: center;
    justify-content: center;
    border: 1px dashed #a9c8b8;
    border-radius: 8px;
    background: #f8fcf9;
}

.qt-login-form {
    margin-top: 22px;
}

.qt-type-wrap {
    margin-bottom: 18px;
    overflow-x: auto;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
}

.qt-type-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
}

.qt-type-table th,
.qt-type-table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--qt-border);
    text-align: left;
    font-size: 13px;
}

.qt-type-table th {
    color: var(--qt-muted);
    background: #f6f9f7;
    font-size: 12px;
    font-weight: 500;
}

.qt-type-table tr:last-child td {
    border-bottom: 0;
}

.qt-type-table input[type="radio"] {
    width: 17px;
    height: 17px;
    accent-color: var(--qt-primary);
}

.qt-auth-status {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin-bottom: 18px;
    padding: 5px 10px;
    border-radius: 999px;
    color: var(--qt-primary-dark);
    background: var(--qt-primary-soft);
    font-size: 12px;
}

.qt-entry-choice h3 {
    margin: 0 0 6px;
    color: var(--qt-ink);
    font-size: 20px;
    font-weight: 500;
}

.qt-entry-choice > p {
    margin: 0 0 18px;
    color: var(--qt-muted);
    font-size: 13px;
}

.qt-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.qt-app .qt-choice-card,
.qt-app input.qt-choice-card,
.qt-app button.qt-choice-card {
    display: flex;
    width: 100%;
    min-height: 96px;
    align-items: center;
    justify-content: center;
    padding: 16px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    color: var(--qt-ink);
    background: #fbfdfc;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.qt-app .qt-choice-card:hover,
.qt-app input.qt-choice-card:hover,
.qt-app button.qt-choice-card:hover {
    border-color: var(--qt-primary);
    color: var(--qt-primary-dark);
    background: var(--qt-primary-soft);
}

.qt-back-link {
    margin: 0 0 12px;
    padding: 0;
    border: 0;
    color: var(--qt-primary-dark);
    background: transparent;
    cursor: pointer;
    font-size: 13px;
}

.qt-select {
    width: 100%;
    min-height: 46px;
    padding: 10px 38px 10px 12px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    outline: 0;
    color: var(--qt-ink);
    background:
        linear-gradient(45deg, transparent 50%, var(--qt-muted) 50%) calc(100% - 18px) 19px / 6px 6px no-repeat,
        linear-gradient(135deg, var(--qt-muted) 50%, transparent 50%) calc(100% - 12px) 19px / 6px 6px no-repeat,
        var(--qt-surface);
    appearance: none;
}

.qt-select:focus {
    border-color: var(--qt-primary);
    box-shadow: 0 0 0 3px rgba(0, 133, 74, 0.12);
}

.qt-selected-type {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: #fbfdfc;
}

.qt-selected-type-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.qt-selected-type-head strong {
    font-size: 14px;
    font-weight: 500;
}

.qt-selected-type-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(130px, 0.8fr);
    gap: 10px;
}

.qt-selected-type-grid > div {
    min-width: 0;
    padding: 10px;
    border-radius: 7px;
    background: var(--qt-surface);
}

.qt-selected-type-grid span {
    display: block;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-selected-type-grid strong {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    font-weight: 500;
}

.qt-login-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

.qt-captcha-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.qt-captcha-row img {
    width: 96px;
    height: 42px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    object-fit: cover;
}

.qt-inline-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.qt-login-fields .qt-inline-actions,
.qt-login-fields .qt-field-full {
    grid-column: 1 / -1;
}

.qt-content-card {
    max-width: 1000px;
    margin: 0 auto;
}

.qt-terms-body {
    padding: 22px;
}

.qt-terms-scroll {
    height: 360px;
    overflow: auto;
    padding: 18px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    color: var(--qt-ink);
    background: #fbfdfc;
}

.qt-terms-scroll h4 {
    margin-top: 0;
}

.qt-agree {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-surface);
}

.qt-agree input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--qt-primary);
}

.qt-upload-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.qt-upload-card {
    padding: 12px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: #fbfdfc;
}

.qt-upload-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 9px;
    font-size: 13px;
    font-weight: 500;
}

.qt-preview {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px dashed #b8cfc2;
    border-radius: 7px;
    background: #f3f8f5;
}

.qt-preview-image {
    display: block;
    width: 100%;
    height: 160px;
    object-fit: contain;
    background: var(--qt-surface);
}

.qt-file {
    margin-top: 10px;
}

.qt-file-input {
    width: 100%;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-auto-upload-tip {
    margin: 8px 0 0;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-upload-mask {
    display: none;
    position: fixed;
    z-index: 9999;
    inset: 0;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(23, 53, 42, 0.38);
}

.qt-upload-mask.is-visible {
    display: flex;
}

.qt-upload-loading {
    width: min(100%, 260px);
    padding: 24px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    text-align: center;
    background: var(--qt-surface);
    box-shadow: 0 18px 45px rgba(23, 53, 42, 0.22);
}

.qt-upload-loading p {
    margin: 14px 0 0;
    color: var(--qt-ink);
    font-size: 14px;
}

.qt-upload-spinner {
    width: 42px;
    height: 42px;
    margin: 0 auto;
    border: 4px solid var(--qt-primary-soft);
    border-top-color: var(--qt-primary);
    border-radius: 50%;
    animation: qt-upload-spin 0.8s linear infinite;
}

.qt-upload-success {
    display: none;
    width: 42px;
    height: 42px;
    margin: 0 auto;
    border-radius: 50%;
    background: var(--qt-primary);
}

.qt-upload-success::after {
    display: block;
    width: 12px;
    height: 22px;
    margin: 6px 0 0 15px;
    border: solid #ffffff;
    border-width: 0 3px 3px 0;
    content: "";
    transform: rotate(45deg);
}

@keyframes qt-upload-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.qt-summary {
    display: grid;
    grid-template-columns: 1.15fr repeat(2, minmax(0, 0.75fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-border);
}

.qt-summary-item {
    min-width: 0;
    padding: 15px;
    background: #fbfdfc;
}

.qt-summary-item span {
    display: block;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-summary-item strong {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: var(--qt-ink);
    font-size: 16px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qt-summary-item .qt-summary-text {
    overflow: visible;
    font-size: 14px;
    line-height: 1.5;
    text-overflow: clip;
    white-space: normal;
}

.qt-status-message {
    margin-top: 16px;
    padding: 14px 16px;
    border-left: 3px solid var(--qt-primary);
    border-radius: 0 8px 8px 0;
    background: var(--qt-primary-soft);
}

.qt-status-message h2,
.qt-status-message p {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
}

.qt-status-message p + p {
    margin-top: 6px;
    color: var(--qt-muted);
    font-weight: 400;
}

.qt-table-wrap {
    margin-top: 16px;
    overflow-x: auto;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
}

.qt-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
    background: var(--qt-surface);
}

.qt-table th,
.qt-table td {
    padding: 12px 13px;
    border-bottom: 1px solid var(--qt-border);
    text-align: left;
    white-space: nowrap;
}

.qt-table th {
    color: var(--qt-muted);
    background: #f6f9f7;
    font-size: 12px;
    font-weight: 500;
}

.qt-table td {
    font-size: 13px;
}

.qt-table tbody tr:last-child td {
    border-bottom: 0;
}

.qt-row-actions {
    display: flex;
    gap: 7px;
}

.qt-document-page {
    max-width: 1050px;
    margin: 0 auto;
}

.qt-document {
    padding: 26px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-surface);
    box-shadow: 0 10px 30px rgba(23, 53, 42, 0.06);
}

.qt-document-title {
    margin: 0 0 20px;
    color: var(--qt-ink);
    text-align: center;
    font-size: 24px;
    font-weight: 500;
}

.qt-document-grid {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) 96px minmax(0, 1fr);
    border-top: 1px solid var(--qt-border);
    border-left: 1px solid var(--qt-border);
}

.qt-document-grid > div {
    min-height: 46px;
    padding: 10px;
    border-right: 1px solid var(--qt-border);
    border-bottom: 1px solid var(--qt-border);
    font-size: 13px;
}

.qt-document-grid .qt-document-label {
    color: var(--qt-muted);
    background: #f8faf9;
}

.qt-document-photos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.qt-document-photo {
    text-align: center;
    font-size: 12px;
}

.qt-document-photo .qt-preview {
    min-height: 180px;
    margin-top: 7px;
}

.qt-document-photo .qt-preview-image {
    height: 180px;
}

.qt-document-note {
    min-height: 110px;
    margin-top: 16px;
    padding: 13px;
    border: 1px solid var(--qt-border);
    font-size: 13px;
}

.qt-document-note strong {
    display: block;
    margin-bottom: 8px;
}

.qt-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.qt-detail-item {
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: #fbfdfc;
}

.qt-detail-item-full {
    grid-column: 1 / -1;
}

.qt-detail-item span {
    display: block;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-detail-item strong {
    display: block;
    margin-top: 5px;
    overflow-wrap: anywhere;
    color: var(--qt-ink);
    font-size: 13px;
    font-weight: 500;
}

.qt-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: #fbfdfc;
}

.qt-list-heading strong {
    display: block;
    color: var(--qt-ink);
    font-size: 16px;
    font-weight: 500;
}

.qt-list-heading span {
    display: block;
    margin-top: 3px;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-list-toolbar {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.qt-list-toolbar p {
    margin: 4px 0 0;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-vehicle-list {
    display: grid;
    gap: 12px;
    margin-top: 16px;
}

.qt-vehicle-card {
    padding: 16px;
    border: 1px solid var(--qt-border);
    border-radius: 8px;
    background: var(--qt-surface);
}

.qt-vehicle-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.qt-vehicle-head strong {
    color: var(--qt-ink);
    font-size: 17px;
    font-weight: 500;
}

.qt-vehicle-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.qt-vehicle-detail {
    min-width: 0;
    padding: 10px;
    border-radius: 7px;
    background: #f8faf9;
}

.qt-vehicle-detail span {
    display: block;
    color: var(--qt-muted);
    font-size: 12px;
}

.qt-vehicle-detail strong {
    display: block;
    margin-top: 4px;
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 500;
}

.qt-vehicle-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
}

.qt-empty-state {
    padding: 28px 18px;
    border: 1px dashed var(--qt-border);
    border-radius: 8px;
    text-align: center;
    background: #fbfdfc;
}

.qt-empty-state strong {
    display: block;
    margin-bottom: 6px;
    font-size: 16px;
    font-weight: 500;
}

.qt-empty-state p {
    margin: 0 0 16px;
    color: var(--qt-muted);
    font-size: 13px;
}

.qt-hidden {
    display: none;
}

@media (max-width: 860px) {
    .qt-public-main {
        grid-template-columns: 1fr;
    }

    .qt-public-intro {
        min-height: 250px;
        padding: 26px;
    }

    .qt-public-intro h1 {
        font-size: 25px;
    }
}

@media (max-width: 760px) {
    .qt-main {
        padding: 14px 12px 28px;
    }

    .qt-appbar-inner,
    .qt-page-head,
    .qt-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .qt-header-badge {
        display: none;
    }

    .qt-brand-title {
        white-space: normal;
    }

    .qt-page-body,
    .qt-public-panel,
    .qt-terms-body {
        padding: 16px;
    }

    .qt-grid,
    .qt-login-fields,
    .qt-selected-type-grid,
    .qt-choice-grid,
    .qt-detail-grid,
    .qt-vehicle-details,
    .qt-upload-grid,
    .qt-document-photos {
        grid-template-columns: 1fr;
    }

    .qt-summary {
        grid-template-columns: 1fr 1fr;
    }

    .qt-actions,
    .qt-inline-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .qt-actions .qt-btn,
    .qt-actions input[type="submit"],
    .qt-actions input[type="button"],
    .qt-inline-actions .qt-btn,
    .qt-inline-actions input[type="submit"] {
        width: 100%;
    }

    .qt-document {
        padding: 14px;
    }

    .qt-document-title {
        font-size: 20px;
    }

    .qt-document-grid {
        grid-template-columns: 82px minmax(0, 1fr);
    }

    .qt-table {
        min-width: 0;
        display: block;
    }

    .qt-table thead {
        display: none;
    }

    .qt-table tbody {
        display: grid;
        gap: 10px;
        padding: 10px;
    }

    .qt-table tr {
        display: block;
        overflow: hidden;
        border: 1px solid var(--qt-border);
        border-radius: 8px;
        background: var(--qt-surface);
    }

    .qt-table td {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 8px;
        padding: 9px 11px;
        border-bottom: 1px solid var(--qt-border);
        white-space: normal;
    }

    .qt-table td::before {
        color: var(--qt-muted);
        font-size: 12px;
    }

    .qt-table td:nth-child(1)::before { content: "申请日期"; }
    .qt-table td:nth-child(2)::before { content: "审批日期"; }
    .qt-table td:nth-child(3)::before { content: "申请车辆"; }
    .qt-table td:nth-child(4)::before { content: "申请状态"; }
    .qt-table td:nth-child(5)::before { content: "申请人"; }
    .qt-table td:nth-child(6)::before { content: "申请类型"; }
    .qt-table td:nth-child(7)::before { content: "收费金额"; }
    .qt-table td:nth-child(8)::before { content: "开始时间"; }
    .qt-table td:nth-child(9)::before { content: "结束时间"; }
    .qt-table td:nth-child(10)::before { content: "操作"; }

    .qt-table-vehicle td:nth-child(1)::before { content: "申请日期"; }
    .qt-table-vehicle td:nth-child(2)::before { content: "车辆牌号"; }
    .qt-table-vehicle td:nth-child(3)::before { content: "申请状态"; }
    .qt-table-vehicle td:nth-child(4)::before { content: "申请人"; }
    .qt-table-vehicle td:nth-child(5)::before { content: "申请类型"; }
    .qt-table-vehicle td:nth-child(6)::before { content: "操作"; }

    .qt-table td:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 480px) {
    .qt-summary {
        grid-template-columns: 1fr;
    }

    .qt-wx-box {
        min-height: 300px;
    }
}

@media print {
    @page {
        size: A4;
        margin: 12mm;
    }

    .qt-app {
        background: #ffffff;
    }

    .qt-appbar,
    .qt-page-head,
    .qt-actions,
    .qt-header-actions {
        display: none !important;
    }

    .qt-main,
    .qt-document-page {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .qt-shell.qt-panel {
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .qt-page-body {
        padding: 0;
    }

    .qt-document {
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .qt-document-title {
        margin-bottom: 16px;
        font-size: 22px;
    }

    .qt-document-grid > div,
    .qt-document-note,
    .qt-document-photo {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .qt-preview,
    .qt-preview-image {
        min-height: 150px;
        height: 150px;
    }
}