#trial-section { min-width: 0; color: #26332e; }
#trial-section [hidden] { display: none !important; }
#trial-section h4 { font-size: 16px; margin: 24px 0 12px; }
#trial-section button { margin-top: 0; border-radius: 4px; white-space: nowrap; }
#trial-section input, #trial-section textarea, #trial-section select { box-sizing: border-box; min-width: 0; width: 100%; padding: 9px 10px; border: 1px solid #cbd5cf; border-radius: 4px; font: inherit; color: #26332e; background: #fff; }
#trial-section input:focus, #trial-section textarea:focus { outline: 2px solid #008cba; outline-offset: 1px; }
#trialStatus { min-height: 24px; margin-bottom: 12px; overflow-wrap: anywhere; }
#trialStatus[data-error="true"] { color: #ad2639; }
.trial-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0 0 20px; padding: 16px 0; border-bottom: 1px solid #dce4df; }
.trial-metrics div { min-width: 0; }
.trial-metrics dt { font-size: 12px; color: #66746c; }
.trial-metrics dd { margin: 7px 0 0; font-size: 18px; font-weight: 600; overflow-wrap: anywhere; }
.trial-redeem { display: grid; grid-template-columns: auto minmax(160px, 1fr) auto; align-items: center; gap: 12px; }
.trial-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 20px 0; border-bottom: 1px solid #dce4df; }
.trial-form label { display: grid; gap: 8px; font-size: 13px; }
.trial-form-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
#trialFormat { color: #52665a; font-family: Consolas, monospace; overflow-wrap: anywhere; }
.trial-heading { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 20px; }
.trial-heading h4 { margin: 0 !important; }
.trial-toggle { display: flex; align-items: center; gap: 8px; font-size: 13px; }
#trial-section .trial-toggle input { width: 16px; height: 16px; }
#trialServiceStatus { margin-top: 12px; color: #53655c; overflow-wrap: anywhere; }
#trialGeneratedCodes { margin-top: 12px; font-family: Consolas, monospace !important; }
.trial-table-wrap { overflow-x: auto; }
.trial-usage { margin: 16px 0 22px; }
.trial-usage summary { cursor: pointer; font-size: 14px; padding: 8px 0; }
#trialModelInfo { font-size: 13px; min-height: 20px; overflow-wrap: anywhere; }
#trial-section select:focus { outline: 2px solid #008cba; outline-offset: 1px; }
#trial-section select { text-overflow: ellipsis; }
#trial-section td small { display: block; color: #66746c; margin-top: 4px; }
#trial-section table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 13px; }
#trial-section th, #trial-section td { text-align: left; padding: 11px 10px; border-bottom: 1px solid #e2e8e4; overflow-wrap: anywhere; }
#trial-section th { background: #f3f7f5; font-weight: 600; white-space: nowrap; }
#trial-section .trial-table-wrap input { width: 105px; }
#trial-section .trial-muted { color: #6b756f; }
.attachment-status { min-height: 20px; margin: 12px 0 8px; color: #53655c; font-size: 13px; }
.attachment-tabs { justify-content: flex-start; margin: 0 0 16px; }
.attachment-tabs .tab { padding: 9px 20px; margin-top: 0; color: #46584d; background: #edf2ef; white-space: nowrap; }
.attachment-tabs .tab:hover:not(:disabled) { color: #2e633d; background: #dfece3; }
.attachment-tabs .tab.active { color: #fff; background: #4CAF50; }
.attachment-tabs .tab.active:hover:not(:disabled) { color: #fff; background: #45a049; }
.attachment-tabs .tab:focus-visible { outline: 2px solid #246b35; outline-offset: 2px; }
.attachment-panel { min-width: 0; }
.attachment-file-list { display: flex; flex-direction: column; gap: 8px; }
.attachment-file-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 16px; min-height: 64px; box-sizing: border-box; padding: 12px 14px; border: 1px solid #dce4df; border-radius: 6px; background: #fafcfb; }
.attachment-file-row:hover { border-color: #b9cfc0; background: #f5f9f6; }
.attachment-file-info { min-width: 0; display: grid; gap: 4px; }
.attachment-file-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 500; line-height: 21px; }
.attachment-file-size, .attachment-file-row time, .skin-card-footer time { color: #607067; font-size: 12px; line-height: 18px; white-space: nowrap; }
.attachment-empty { grid-column: 1 / -1; padding: 44px 16px; color: #607067; text-align: center; border: 1px dashed #cbd5cf; border-radius: 8px; background: #fafcfb; }
.attachment-error { grid-column: 1 / -1; padding: 18px 12px; color: #ad2639; border: 1px solid #e8c4c9; border-radius: 6px; overflow-wrap: anywhere; }
.attachment-error button { margin: 0 0 0 8px; padding: 7px 12px; vertical-align: middle; }
.skin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 16px; }
.skin-card { min-width: 0; overflow: hidden; border: 1px solid #dce4df; border-radius: 8px; background: #fff; box-shadow: 0 2px 8px rgba(42, 72, 57, .06); }
.skin-preview { aspect-ratio: 16 / 11; display: flex; align-items: center; justify-content: center; box-sizing: border-box; overflow: hidden; padding: 12px; background: #f4f7f6; background-image: conic-gradient(#edf2ef 25%, transparent 0 50%, #edf2ef 0 75%, transparent 0); background-size: 20px 20px; border-bottom: 1px solid #e2e8e4; }
.skin-preview img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; }
.skin-image-error .skin-preview::after { content: '预览不可用'; color: #76837c; font-size: 13px; }
.skin-image-error .skin-preview img { display: none; }
.skin-card-footer { display: grid; gap: 10px; padding: 12px; }
.skin-name { min-width: 0; height: 44px; line-height: 22px; font-size: 14px; font-weight: 600; overflow: hidden; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.skin-card-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.skin-card-meta .attachment-download { margin-left: auto; }
.trial-list-help { margin: 24px 0 0; color: #66746c; font-size: 13px; line-height: 1.7; }
.trial-list { --visible-rows: 10; --trial-row-height: 64px; --trial-head-height: 44px; min-width: 0; border: 1px solid #dce4df; border-radius: 6px; overflow: hidden; }
.trial-list-viewport { height: calc(var(--trial-head-height) + var(--visible-rows) * var(--trial-row-height) + var(--trial-scrollbar-height, 0px)); overflow: scroll; overscroll-behavior: contain; scrollbar-gutter: stable; }
.trial-list-viewport::-webkit-scrollbar { width: 12px; height: 12px; }
.trial-list-viewport::-webkit-scrollbar-track, .trial-list-viewport::-webkit-scrollbar-corner { background: #edf2ef; }
.trial-list-viewport::-webkit-scrollbar-thumb { background: #91a89b; border: 3px solid #edf2ef; border-radius: 8px; }
.trial-list-viewport::-webkit-scrollbar-thumb:hover { background: #667f71; }
.trial-list-viewport:focus-visible { outline: 2px solid #008cba; outline-offset: -2px; }
#trial-section .trial-list table { margin: 0; min-width: 740px; table-layout: fixed; border-collapse: separate; border-spacing: 0; }
#trial-section .trial-list th { position: sticky; top: 0; z-index: 1; height: var(--trial-head-height); box-sizing: border-box; padding: 8px 10px; font-size: 12px; border: 0; border-right: 1px solid #e2e8e4; box-shadow: inset 0 -1px #dce4df; }
#trial-section .trial-list th:last-child { width: 160px; }
#trial-section .trial-list td { padding: 0; border: 0; border-bottom: 1px solid #e2e8e4; border-right: 1px solid #e2e8e4; }
.trial-cell { height: calc(var(--trial-row-height) - 1px); box-sizing: border-box; padding: 8px 10px; display: flex; flex-direction: column; justify-content: center; line-height: 18px; overflow: hidden; }
#trial-section .trial-list td small { margin-top: 2px; }
.trial-cell-content { max-height: 100%; overflow: hidden; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.trial-cell-content:has(small) { display: block; }
.trial-primary, #trial-section .trial-list td small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trial-cell.trial-actions { flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; padding: 8px; }
#trial-section .trial-actions input { width: 90px; padding: 7px; }
#trial-section .trial-actions button { padding: 7px 9px; font-size: 13px; }
.trial-list-footer { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 12px; border-top: 1px solid #dce4df; background: #fafcfb; font-size: 13px; }
.trial-list-summary { color: #66746c; }
.trial-pagination { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; }
#trial-section .trial-pagination button { min-width: 32px; height: 32px; padding: 0 8px; background: #fff; color: #365445; border: 1px solid #cbd5cf; }
#trial-section .trial-pagination button[aria-current="page"] { color: #fff; background: #087e62; border-color: #087e62; font-weight: 600; }
#trial-section .trial-pagination button:disabled { opacity: .45; cursor: default; }
#trial-section .trial-pagination button[aria-current="page"]:disabled { opacity: 1; }
.trial-visible-rows { display: flex; gap: 6px; align-items: center; margin-left: auto; white-space: nowrap; }
#trial-section .trial-visible-rows select { width: 68px; padding: 6px; }
.trial-list-message { color: #66746c; }
.trial-list-error { color: #ad2639; }
@media (max-width: 700px) {
    .trial-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .trial-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .trial-redeem { grid-template-columns: minmax(0, 1fr) auto; }
    .trial-redeem label { grid-column: 1 / -1; }
    #trialModelForm { grid-template-columns: minmax(0, 1fr); }
    #trialModelSave { justify-self: end; }
    #trial-section .header-title { gap: 12px; }
}
@media (max-width: 420px) { .trial-form { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) {
    .attachment-file-row { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; }
    .attachment-file-row time { grid-column: 1; }
    .attachment-file-name { white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    .attachment-file-row .attachment-download { grid-column: 2; grid-row: 1 / span 2; }
    .skin-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 12px; }
    .attachment-tabs .tab { flex: 1; padding: 8px 6px; font-size: 14px; }
}