﻿[hidden] { display: none !important; }
main { max-width: 860px; }
body:has(#playing:not([hidden])) main { padding-bottom: 155px; }
a { color: var(--text); text-underline-offset: .2em; }
.back { display: inline-flex; align-items: center; min-height: 44px; }
h1 { margin-bottom: 14px; }
.search-panel { margin-bottom: 18px; }
.search-panel label { display: block; font-weight: 650; }
#search { margin: 6px 0; font-size: 16px; }
#quests { display: grid; gap: 10px; }
.quest h2 { overflow-wrap: anywhere; }
.quest .stages { display: grid; gap: 7px; margin-top: 8px; }
.track { display: flex; gap: 10px; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 7px; }
.track span { min-width: 0; overflow-wrap: anywhere; }
.track button { flex: none; min-height: 44px; }
#more { min-height: 44px; margin-top: 14px; width: 100%; }
#playing { position: fixed; inset: auto 0 0; z-index: 2; width: min(100%, 860px); margin-inline: auto; padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); background: #eef2f7; border-radius: 18px 18px 0 0; }
#now { display: block; overflow-wrap: anywhere; }
#audio { display: block; width: 100%; margin-top: 5px; }
#play-error { color: #9b2d24; }
