.history-shangan-page .history-main {
    max-width: 1060px;
    margin: 0 auto;
    padding: 24px 0;
}
.history-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: #788496;
    font-size: 13px;
   
}
.history-back:hover {
    color: #e60012;
   
}
.history-summary {
    padding: 26px;
    border: 1px solid #f8dce0;
    border-radius: 18px;
    background: linear-gradient(120deg, #fff5f6, #fff);
   
}
.history-kicker {
    color: #e60012;
    font-size: 12px;
    font-weight: 600;
   
}
.history-summary h1 {
    margin: 9px 0;
    font-size: 26px;
    line-height: 1.4;
   
}
.history-source {
    margin: 0;
    color: #7c899a;
    font-size: 13px;
    overflow-wrap: anywhere;
   
}
.history-overview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
   
}
.history-overview > div {
    padding: 16px;
    background: #fff;
    border: 1px solid #f3e4e7;
    border-radius: 12px;
   
}
.history-overview span {
    display: block;
    color: #8390a1;
    font-size: 12px;
   
}
.history-overview b {
    display: block;
    margin-top: 6px;
    color: #e60012;
    font-size: 26px;
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
   
}
.history-overview em {
    margin-left: 5px;
    color: #9c8790;
    font-size: 12px;
    font-weight: 400;
    font-style: normal;
   
}
.history-overview b.history-years {
    color: #657184;
    font-size: 21px;
   
}
.history-summary-note {
    margin: 14px 0 0;
    color: #a0868d;
    font-size: 12px;
   
}
.history-list {
    margin-top: 24px;
   
}
.history-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
   
}
.history-list-heading h2 {
    margin: 0;
    font-size: 17px;
   
}
.history-list-heading > span {
    color: #8b97a8;
    font-size: 12px;
   
}
.history-sample-card {
    margin-bottom: 12px;
    padding: 20px;
    background: #fff;
    border: 1px solid #e9edf3;
    border-radius: 15px;
   
}
.history-sample-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 18px;
   
}
.history-sample-heading h3 {
    margin: 9px 0 5px;
    font-size: 17px;
    line-height: 1.5;
    overflow-wrap: anywhere;
   
}
.history-sample-heading h3 a:hover {
    color: #e60012;
   
}
.history-year {
    display: inline-flex;
    padding: 3px 8px;
    border-radius: 6px;
    background: #fff1f3;
    color: #d62c42;
    font-size: 11px;
   
}
.history-unit {
    margin: 0;
    color: #7e899a;
    font-size: 13px;
    overflow-wrap: anywhere;
   
}
.history-sample-score {
    padding: 10px 14px;
    border-radius: 11px;
    background: #fff7ee;
    text-align: right;
   
}
.history-sample-score span {
    display: block;
    color: #aa835b;
    font-size: 11px;
   
}
.history-sample-score b {
    display: block;
    margin-top: 4px;
    color: #db7b12;
    font-size: 24px;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
   
}
.history-exam {
    margin: 15px 0;
    padding: 9px 11px;
    border-radius: 8px;
    background: #fcf7f8;
    color: #7d899a;
    font-size: 12px;
    line-height: 1.7;
    overflow-wrap: anywhere;
   
}
.history-exam span {
    margin-right: 8px;
    color: #d53449;
   
}
.history-sample-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 12px;
    border-top: 1px solid #edf0f5;
   
}
.history-sample-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    color: #8390a1;
    font-size: 12px;
   
}
.history-sample-counts b {
    color: #2b2f35;
    font-weight: 600;
   
}
.history-detail {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid #ffd7dc;
    border-radius: 9px;
    background: #fff3f5;
    color: #e60012;
    font-size: 12px;
    white-space: nowrap;
   
}
.history-detail:hover {
    background: #ffe7eb;
   
}
.history-empty {
    padding: 30px;
    background: #fff;
    border-radius: 14px;
    text-align: center;
    color: #8a96a8;
    font-size: 13px;
   
}
.history-note {
    margin: 16px 0 0;
    color: #98a2af;
    text-align: center;
    font-size: 12px;
   
}
.history-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 20px;
   
}
.history-pagination > a, .history-pagination > .is-disabled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    padding: 0 12px;
    border: 1px solid #f3d9dd;
    border-radius: 10px;
    background: #fff;
    color: #c93549;
    font-size: 12px;
    white-space: nowrap;
   
}
.history-pagination > .is-disabled {
    color: #a4adba;
    background: #f4f6f9;
    border-color: #e9edf3;
   
}
.history-page-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #8591a3;
    font-size: 12px;
    white-space: nowrap;
   
}
.history-page-status b {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 5px;
    background: #e60012;
    border-radius: 9px;
    color: #fff;
   
}
.history-shangan-page a:focus-visible {
    outline: 2px solid #e60012;
    outline-offset: 3px;
   
}
.mobile.history-shangan-page .history-main {
    padding: 12px 10px 20px;
   
}
.mobile .history-back {
    margin: 0 0 10px;
    font-size: 12px;
   
}
.mobile .history-summary {
    padding: 15px 12px;
    border-radius: 14px;
   
}
.mobile .history-summary h1 {
    font-size: 19px;
    margin: 6px 0;
   
}
.mobile .history-source {
    font-size: 11px;
    line-height: 1.6;
   
}
.mobile .history-overview {
    gap: 6px;
    margin-top: 13px;
   
}
.mobile .history-overview > div {
    padding: 10px 6px;
    border-radius: 9px;
   
}
.mobile .history-overview span {
    font-size: 10px;
   
}
.mobile .history-overview b {
    font-size: 19px;
   
}
.mobile .history-overview b.history-years {
    font-size: 12px;
    line-height: 25px;
    white-space: nowrap;
   
}
.mobile .history-summary-note {
    margin-top: 10px;
    font-size: 10px;
   
}
.mobile .history-list {
    margin-top: 18px;
   
}
.mobile .history-list-heading h2 {
    font-size: 15px;
   
}
.mobile .history-sample-card {
    padding: 12px;
    border-radius: 13px;
   
}
.mobile .history-sample-heading {
    gap: 9px;
   
}
.mobile .history-sample-heading h3 {
    margin: 7px 0 5px;
    font-size: 14px;
   
}
.mobile .history-unit {
    font-size: 11px;
   
}
.mobile .history-sample-score {
    padding: 8px;
   
}
.mobile .history-sample-score span {
    font-size: 9px;
   
}
.mobile .history-sample-score b {
    font-size: 19px;
   
}
.mobile .history-exam {
    margin: 12px 0;
    padding: 7px 8px;
    font-size: 11px;
   
}
.mobile .history-sample-counts {
    gap: 7px;
    font-size: 10px;
   
}
.mobile .history-sample-bottom {
    gap: 6px;
   
}
.mobile .history-detail {
    min-height: 32px;
    padding: 0 9px;
    font-size: 11px;
    gap: 5px;
   
}
.mobile .history-pagination {
    gap: 8px;
   
}
.mobile .history-pagination > a, .mobile .history-pagination > .is-disabled {
    padding: 0 9px;
   
}
.mobile .history-note {
    font-size: 10px;
    line-height: 1.7;
   
}

/* Reference sample filters */
.history-filters{margin:20px 0;padding:22px;border:1px solid #f0dce2;border-radius:20px;background:linear-gradient(120deg,#fff9fa,#fff 55%);box-shadow:0 5px 20px #92223a05}
.history-filter-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:18px}.history-filter-heading strong{font-size:17px;color:#263747}.history-filter-heading>span{font-size:12px;color:#8c94a0}
.history-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.history-filter-grid label,.history-filter-score{display:flex;flex-direction:column;gap:7px;min-width:0}.history-filter-grid label>span,.history-filter-score>span{font-size:12px;color:#697785}.history-filter-grid input,.history-filter-grid select{width:100%;min-width:0;box-sizing:border-box;height:43px;border:1px solid #e7e8ed;border-radius:10px;background:#fff;padding:0 11px;font:inherit;font-size:14px;color:#273647}.history-filter-grid input:focus,.history-filter-grid select:focus{outline:2px solid #fbd2dc;border-color:#e6002d}.history-filter-keyword,.history-filter-score{grid-column:span 2}.history-filter-score>div{display:flex;align-items:center;gap:8px}.history-filter-score em{font-style:normal;color:#99a0aa}.history-filter-actions{display:flex;gap:16px;align-items:center;margin-top:18px}.history-filter-actions>span{margin-right:auto;font-size:12px;color:#7d8792}.history-filter-actions b{color:#e6002d}.history-filter-actions a{font-size:13px;color:#697785}.history-filter-actions button{border:0;border-radius:10px;background:#e6002d;color:#fff;padding:11px 22px;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
@media(max-width:767px){.history-filters{padding:16px;margin:16px 0;border-radius:17px}.history-filter-heading{justify-content:space-between;gap:8px;margin-bottom:14px}.history-filter-heading strong{font-size:16px}.history-filter-heading>span{font-size:11px}.history-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.history-filter-actions{gap:12px}.history-filter-actions button{padding:11px 16px}.history-filter-actions>span{line-height:1.5}}