/* Resolver - one box, and the whole answer under it. */

#phrase {
    width: 100%;
    padding: 0.7rem 0.85rem;
    font-size: 1.05rem;
    background: #262626;
    color: #e5e7eb;
    border: 1px solid #3f3f3f;
    border-radius: 0.5rem;
}
#phrase:focus { outline: none; border-color: #4caf50; }

#workspace label {
    display: block;
    font-size: 0.8rem;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
}

.verdict-card { margin-top: 1.5rem; }

.verdict-head { display: flex; align-items: baseline; gap: 0.75rem; flex-wrap: wrap; }
.verdict-title { font-size: 1.15rem; font-weight: 700; color: #f0f0f0; }

.status-exact { color: #86efac; }
.status-alias { color: #86efac; }
.status-contains { color: #ffd479; }
.status-fuzzy { color: #ffb74d; }
.status-ambiguous { color: #ff9800; }
.status-nomatch { color: #fca5a5; }

.why { margin: 0.75rem 0; color: #d1d5db; font-size: 0.9rem; line-height: 1.6; }
.why code { background: #171717; padding: 0.1rem 0.35rem; border-radius: 0.25rem; }

.price-table { width: 100%; border-collapse: collapse; margin-top: 0.75rem; font-size: 0.9rem; }
.price-table th {
    text-align: left;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #9ca3af;
    padding: 0.4rem 0.6rem;
    border-bottom: 1px solid #333;
}
.price-table td { padding: 0.45rem 0.6rem; border-bottom: 1px solid #262626; color: #e5e7eb; }
.price-table .num { text-align: right; white-space: nowrap; }
.not-stocked { color: #9ca3af; }

.candidates { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.5rem; }
.candidate {
    background: #262626;
    border: 1px solid #3f3f3f;
    border-radius: 999px;
    padding: 0.25rem 0.7rem;
    font-size: 0.85rem;
    color: #d1d5db;
    cursor: pointer;
}
.candidate:hover { border-color: #4caf50; color: #fff; }