.quests-page {
    background-color: var(--bg-primary);
    cursor: url('../template/images/default.cur'), auto;
}

.quests-page::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
    pointer-events: none;
    background: var(--bg-primary) url('../template/images/main_bg.png') no-repeat center center / cover;
}

.quests-page .content { gap: 24px; }

.quests-page .header-inner { height: 50px; }
.quests-page .header-logo-text { font-size: 1.15rem; }
.quests-page button,
.quests-page .btn,
.quests-page select { cursor: url('../template/images/pointer.cur'), pointer; }
.quests-page input { cursor: url('../template/images/text.cur'), text; }
.quests-page .header-logo,
.quests-page .nav a,
.quests-page .wumpus-badge,
.quests-page .wumpus-badge img { cursor: url('../template/images/text.cur'), text; }

.quests-hero { padding: 0; }
.quests-hero .hero-content { padding: 30px 32px; }

.quest-summary {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 20px;
    color: var(--text-secondary);
    font-size: .85rem;
}

.quest-summary strong { color: var(--accent); font-size: 1.45rem; line-height: 1; }

.quest-summary span {
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1;
}

.quest-catalog,
.quest-detail {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: rgba(34, 48, 63, .92);
}

.quest-catalog-header,
.quest-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
}

.quest-catalog-header h2,
.quest-detail-header h2 { font-size: 1.05rem; }
.quest-catalog-header p,
.quest-detail-header p { margin-top: 4px; color: var(--text-secondary); font-size: .85rem; }

.quest-reset,
.quest-back {
    flex: none;
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-size: .78rem;
}

.quest-reset:hover,
.quest-back:hover { border-color: var(--accent); color: var(--accent-hover); }

.quest-filters {
    display: grid;
    grid-template-columns: 1.45fr 1fr 1.18fr .5fr .5fr;
    gap: 10px;
    padding: 16px;
    border-bottom: 1px solid var(--border);
    background: rgba(24, 33, 43, .45);
}

.quest-filters label {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: var(--text-secondary);
    font-size: .76rem;
}

.quest-filters input,
.quest-filters select {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 6px 9px;
    border: 1px solid var(--border);
    border-radius: 5px;
    outline: 0;
    background: var(--bg-primary);
    color: var(--text-primary);
    font: inherit;
    font-size: .82rem;
}

.quest-filters input:focus,
.quest-filters select:focus { border-color: var(--accent); }

.quest-list-wrap { padding: 12px 16px 16px; }

.quest-list-head,
.quest-row {
    display: grid;
    grid-template-columns: 46px minmax(0, 1.5fr) minmax(90px, .85fr) minmax(100px, .95fr) 86px;
    gap: 12px;
    align-items: center;
}

.quest-list-head {
    padding: 7px 10px;
    color: var(--text-muted);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.quest-list { border-top: 1px solid var(--border); }

.quest-row {
    min-height: 53px;
    padding: 9px 10px;
    border-bottom: 1px solid rgba(46, 63, 80, .72);
    color: var(--text-secondary);
    font-size: .8rem;
}

.quest-row:hover { background: rgba(42, 58, 74, .62); }
.quest-row-level { color: var(--accent); font-weight: 700; text-align: center; }
.quest-row-title { min-width: 0; color: var(--text-primary); font-weight: 600; }
.quest-row-title:hover { color: var(--accent-hover); }
.quest-row-place,
.quest-row-type { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quest-row-xp { color: var(--accent); font-weight: 700; text-align: right; white-space: nowrap; }

.quest-empty { padding: 30px 20px; color: var(--text-secondary); text-align: center; font-size: .88rem; }

.quest-pagination {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 14px;
}

.quest-pagination button {
    min-width: 30px;
    height: 29px;
    padding: 0 8px;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: var(--bg-primary);
    color: var(--text-secondary);
    font: inherit;
    font-size: .78rem;
}

.quest-pagination button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent-hover); }
.quest-pagination button[aria-current='page'] { border-color: var(--accent-dark); background: rgba(201, 168, 76, .14); color: var(--accent); }
.quest-pagination button:disabled { opacity: .45; cursor: default; }

.quest-detail[hidden] { display: none; }
.quest-detail-body { padding: 18px 20px 20px; }

.quest-imported-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-bottom: 14px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--border);
}

.quest-imported-summary-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 9px 11px;
    background: rgba(24, 33, 43, .7);
    font-size: .8rem;
}

.quest-imported-summary-item span { color: var(--text-muted); font-size: .72rem; }
.quest-imported-summary-item strong { overflow: hidden; color: var(--text-primary); text-overflow: ellipsis; white-space: nowrap; }

.quest-detail-content {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: rgba(24, 33, 43, .5);
}

.quest-detail-content > div {
    min-width: 0;
    padding: 11px 13px;
    border-bottom: 1px solid rgba(46, 63, 80, .72);
    color: var(--text-secondary);
    font-size: .86rem;
    line-height: 1.55;
    white-space: pre-line;
}

.quest-detail-content > div:nth-last-child(-n+2) { border-bottom: 0; }
.quest-detail-content .quest_quest_title,
.quest-detail-content .quest_quest_info_title {
    color: var(--text-primary);
    background: rgba(30, 42, 54, .58);
    font-weight: 700;
}

.quest-detail-content .quest_quest_target_bg,
.quest-detail-content .quest_rewards,
.quest-detail-content .quest_quest_reward_item_clear {
    grid-column: 1 / -1;
}

.quest-detail-content .quest_rewards:empty,
.quest-detail-content .quest_quest_reward_item_clear { display: none; }

.quest-detail-content .quest_quest_target_bg {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 13px;
}

.quest-detail-content .quest_quest_target_img {
    width: 34px;
    height: 34px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.quest-detail-content .quest_quest_target_value { color: var(--accent); font-weight: 700; }
.quest-detail-content .quest_img_lant { width: 17px; height: 17px; vertical-align: text-bottom; }
.quest-detail-content a { color: var(--accent); }
.quest-detail-content a:hover { color: var(--accent-hover); }

@media (max-width: 820px) {
    .quest-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .quest-filter-search { grid-column: 1 / -1; }
}

@media (max-width: 580px) {
    .quest-catalog-header,
    .quest-detail-header { padding: 15px; }
    .quest-filters,
    .quest-list-wrap,
    .quest-detail-body { padding-left: 12px; padding-right: 12px; }
    .quest-list-head { display: none; }
    .quest-row { grid-template-columns: 34px minmax(0, 1fr); gap: 4px 10px; }
    .quest-row-level { grid-row: span 4; }
    .quest-row-title { padding-top: 2px; }
    .quest-row-place,
    .quest-row-type,
    .quest-row-xp { grid-column: 2; font-size: .74rem; }
    .quest-row-xp { text-align: left; }
    .quest-row-place::before { content: 'Локация: '; color: var(--text-muted); }
    .quest-row-type::before { content: 'Тип: '; color: var(--text-muted); }
    .quest-detail-content { grid-template-columns: 1fr; }
    .quest-imported-summary { grid-template-columns: 1fr; }
    .quest-detail-content > div { border-bottom: 0; }
    .quest-detail-content .quest_quest_title,
    .quest-detail-content .quest_quest_info_title { padding-bottom: 4px; }
    .quest-detail-content .quest_quest_title + div,
    .quest-detail-content .quest_quest_info_title + div { padding-top: 4px; border-bottom: 1px solid rgba(46, 63, 80, .72); }
}
