* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: #f5f5f2;
    color: #181818;
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.container {
    width: min(720px, calc(100% - 32px));
    margin: 0 auto;
    padding: 64px 0;
}

.container-wide {
    width: min(1180px, calc(100% - 32px));
}

.page-header {
    margin-bottom: 32px;
}

.eyebrow {
    margin-bottom: 8px;
    color: #6b5700;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

h1 {
    margin: 0 0 12px;
    font-size: clamp(2rem, 7vw, 3.5rem);
    line-height: 1;
}

.intro {
    max-width: 620px;
    color: #555;
    font-size: 1.05rem;
    line-height: 1.6;
}

.search-form {
    display: grid;
    gap: 20px;
    padding: 28px;
    border: 1px solid #deded8;
    border-radius: 16px;
    background: white;
    box-shadow: 0 12px 40px rgb(0 0 0 / 6%);
}

.field {
    display: grid;
    gap: 8px;
}

label {
    font-weight: 650;
}

input,
select,
button {
    width: 100%;
    min-height: 46px;
    border-radius: 9px;
    font: inherit;
}

input,
select {
    border: 1px solid #bcbcb4;
    padding: 10px 12px;
    background: white;
}

input:focus,
select:focus {
    outline: 3px solid rgb(255 203 5 / 35%);
    border-color: #8a7000;
}

button {
    margin-top: 4px;
    border: 0;
    padding: 12px 18px;
    background: #171717;
    color: white;
    cursor: pointer;
    font-weight: 700;
}

button:hover {
    background: #343434;
}

small,
.disclaimer {
    color: #686868;
}

.disclaimer {
    margin-top: 24px;
    line-height: 1.5;
}

.error-box,
.warning-box {
    margin: 24px 0;
    padding: 18px 20px;
    border-radius: 10px;
}

.error-box {
    border: 1px solid #c83333;
    background: #fff1f1;
}

.warning-box {
    border: 1px solid #d7ad00;
    background: #fff9dc;
}

.error-box ul {
    margin-bottom: 0;
}

.back-link {
    display: inline-block;
    margin-bottom: 32px;
    color: #333;
}

.table-wrapper {
    overflow-x: auto;
    border: 1px solid #d9d9d3;
    border-radius: 12px;
    background: white;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 14px 16px;
    border-bottom: 1px solid #e7e7e2;
    text-align: left;
    white-space: nowrap;
}

th {
    background: #efefe9;
    font-size: 0.82rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

tbody tr:last-child td {
    border-bottom: 0;
}

.status {
    display: inline-block;
    min-width: 52px;
    border-radius: 999px;
    padding: 5px 10px;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 700;
}

.status-open {
    background: #e2f5e6;
    color: #126225;
}

.status-full {
    background: #f5e4e4;
    color: #8b2020;
}

@media (max-width: 640px) {
    .container {
        padding: 36px 0;
    }

    .search-form {
        padding: 20px;
    }
}

.watch-panel {
    display: grid;
    gap: 12px;
    margin-top: 24px;
    padding: 22px;
    border: 1px solid #d9d9d3;
    border-radius: 12px;
    background: white;
}

table input[type="radio"] {
    width: 18px;
    min-height: 18px;
    margin: 0;
}