.ctabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.ctabs button { border: 0; border-radius: 10px; padding: 10px 14px; background: var(--panel); color: var(--muted); font: 700 15px var(--body); cursor: pointer; }
.ctabs button:hover { color: #fff; }
.ctabs button[aria-selected="true"] { background: var(--gold); color: var(--ink); }
.tab[hidden] { display: none; }
.tab { display: grid; gap: 14px; }
.tier-card { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.tier-big { font: 400 clamp(30px, 5vw, 48px)/1 var(--display); color: var(--tc, #fff); }
.tier-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.tier-box { background: var(--panel); border-radius: 14px; padding: 12px 14px; box-shadow: inset 0 0 0 2px transparent; }
.tier-box.on { box-shadow: inset 0 0 0 2px var(--gold); }
.tier-box h3 { margin: 0; font: 400 19px var(--display); color: var(--tc, #fff); }
.tier-box small { color: var(--muted); }
.tier-box ul { margin: 8px 0 0; padding-left: 18px; font-size: 14px; }
.t-bronze { --tc: #e0a070; } .t-silver { --tc: #d6dcec; } .t-gold { --tc: #ffd84d; } .t-platinum { --tc: #9ff0e4; } .t-diamond { --tc: #8fd0ff; }
.row-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.row-list li { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--panel-2); border-radius: 10px; padding: 8px 12px; flex-wrap: wrap; }
.row-list li.empty { background: none; color: var(--muted); }
.row-list small { color: var(--muted); }
.row-list b.up { color: #7dff9b; } .row-list b.down { color: #ff8aa8; }
.form-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.form-row input, .form-row select { flex: 1; min-width: 130px; padding: 9px 10px; border: 0; border-radius: 10px; background: #f7f3ff; color: var(--ink); font: 400 15px var(--body); }
.hall-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.up-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 14px; align-items: start; }
.up-tabs { display: grid; gap: 6px; max-height: 620px; overflow-y: auto; }
.up-tabs button { display: grid; justify-items: start; gap: 3px; padding: 11px 13px; border: 0; border-left: 4px solid transparent; border-radius: 12px; background: var(--panel); color: var(--text); font: 500 14px var(--body); text-align: left; cursor: pointer; }
.up-tabs button:hover { background: var(--panel-2); }
.up-tabs button[aria-selected="true"] { background: var(--panel-2); border-left-color: var(--gold); }
.up-tabs small { color: var(--muted); font-size: 12px; }
.up-tabs b { font-size: 15px; line-height: 1.25; color: #fff; }
.up-panel { padding: 18px 22px 20px; border-radius: 16px; background: var(--panel); min-width: 0; }
.up-panel:focus-visible { outline: 2px solid var(--gold); }
.up-panel header { display: flex; align-items: center; gap: 8px; }
.up-panel header small { color: var(--muted); }
.up-panel h2 { margin: 10px 0 14px; font: 400 clamp(22px, 3vw, 30px)/1.1 var(--display); color: #fff; }
@media (max-width: 760px) { .hall-grid, .up-layout { grid-template-columns: 1fr; } .up-tabs { max-height: 250px; } .up-panel { padding: 14px 16px; } }