/* 阿莫比 — 正式網站補充樣式
 * site.css 是設計規範，原封不動沿用；這裡只放正式站才需要的東西：
 * 手機選單、真實資料的空狀態、單邊陣營、普查方法頁、站長上傳頁。
 */

/* ---------- buttons that look like the existing tabs / segments / pager ---------- */
.tabs button,.seg button,.pager button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
.tabs button{padding:0 0 10px;border-bottom:2px solid transparent;font-family:var(--serif);font-weight:700;font-size:15.5px;color:var(--faint)}
.tabs button.on{color:var(--text);border-bottom-color:var(--gold)}
.tabs button:hover,.seg button:hover,.pager button:hover{color:var(--gold-hi)}
.seg button{padding:6px 13px;font-size:13px;font-weight:700;color:var(--muted);border-left:1px solid var(--line)}
.seg button:first-child{border-left:0}
.seg button.on{background:rgba(201,163,91,.14);color:var(--gold-hi)}
.pager button{min-width:34px;height:34px;display:grid;place-items:center;padding:0 10px;border:1px solid var(--line);border-radius:7px;font-size:13.5px;color:var(--muted)}
.pager button.on{border-color:var(--gold);color:var(--gold-hi);background:rgba(201,163,91,.1)}
.pager button:disabled{opacity:.4;cursor:default}

/* ---------- top bar: idle census light, phone menu ---------- */
.live.idle i{background:var(--faint);box-shadow:none;animation:none}
@media (max-width:820px){
  .topbar.nav-open .nav{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;padding:4px 20px 12px;background:rgba(10,8,6,.97);border-bottom:1px solid var(--line-soft)}
  .topbar.nav-open .nav a{padding:12px 0;border-top:1px solid var(--line-soft)}
  .topbar.nav-open .nav a:first-child{border-top:0}
  .topbar.nav-open .nav a.on::after{display:none}
}
@media (max-width:640px){ .topbar.nav-open .nav{padding:4px 14px 12px} }

/* ---------- hero: one faction only / no data yet ---------- */
.side .num.is-count{font-size:62px}
.side .num.is-missing{color:rgba(255,255,255,.4);text-shadow:none}
@media (max-width:640px){ .side .num.is-count{font-size:38px} }
.divide.compact .num.is-count{font-size:50px}
@media (max-width:640px){ .divide.compact .num.is-count{font-size:34px} }

/* ---------- home: the news beside the hero shows one-line titles on desktop,
   so long official titles don't stretch the hero taller than the design ---------- */
@media (min-width:1080px){ .news-card .news .ttl{-webkit-line-clamp:1} }

/* ---------- empty states ---------- */
.empty{color:var(--faint);font-size:13.5px}
.news li.empty{padding:16px 18px}
.guilds li.empty{display:block;padding:10px 4px;border-bottom:0}
.races li.empty{display:block}
.hours i.none{background:none;border-bottom:2px dotted var(--line);border-radius:0;height:0;min-height:0}
.lk.soon{color:var(--muted)}
.lk.soon svg{color:var(--faint)}

/* census page */
.matrix td.tiny{color:var(--muted)}
.rounds .fd{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;vertical-align:1px}
.rounds .fd.a{background:var(--ally)} .rounds .fd.h{background:var(--horde)}
.rounds th,.rounds td{white-space:nowrap}
.rounds td.empty{text-align:left;color:var(--faint)}
@media (max-width:640px){ .rounds th,.rounds td{padding-left:5px;padding-right:5px} }
.key .off{opacity:.45}

/* ---------- census method page ---------- */
.sched{width:100%;border-collapse:collapse;font-size:14px}
.sched th{font-weight:500;font-size:12px;color:var(--faint);text-align:left;padding:6px 10px;border-bottom:1px solid var(--line)}
.sched td{padding:10px;border-bottom:1px solid var(--line-soft);vertical-align:top}
.sched td:first-child{font-family:var(--serif);font-weight:700;white-space:nowrap}
.sched td.t{white-space:nowrap;color:var(--gold-hi);font-weight:700}
.sched tr:last-child td{border-bottom:0}
.limits.six{grid-template-columns:repeat(3,1fr)}
.note-line{margin:12px 0 0;font-size:13px;color:var(--faint)}
.note-line a{color:var(--gold)}
@media (max-width:820px){ .limits.six{grid-template-columns:1fr} }

/* ---------- owner upload page ---------- */
.field{display:grid;gap:6px}
.field label{font-size:13px;color:var(--muted)}
.field input[type=password],.field input[type=text]{height:40px;padding:0 12px;border:1px solid var(--line);border-radius:7px;background:#100c09;color:var(--text);font:inherit;font-size:14px}
.field input:focus-visible{outline:2px solid var(--gold-hi);outline-offset:1px}
.inline{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.inline .field{flex:1 1 240px}
.check{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--muted)}
.drop{cursor:pointer}
.drop.over{border-color:var(--gold-hi);background:rgba(201,163,91,.09)}
.drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.status{margin:12px 0 0;font-size:13.5px;color:var(--muted)}
.status.ok{color:var(--live)} .status.err{color:#ff8a7a}
.tbl-wrap{overflow-x:auto}
.up-table{width:100%;border-collapse:collapse;font-size:13.5px;white-space:nowrap}
.up-table th{font-weight:500;font-size:12px;color:var(--faint);text-align:right;padding:6px 8px;border-bottom:1px solid var(--line)}
.up-table td{padding:8px;border-bottom:1px solid var(--line-soft);text-align:right}
.up-table th:first-child,.up-table td:first-child,.up-table th.l,.up-table td.l{text-align:left}
.up-table .act{color:var(--gold-hi)}
.up-table .warn{color:#ffb38a}
.up-table button{font:inherit;font-size:12.5px;padding:3px 9px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--muted);cursor:pointer}
.up-table button:hover{color:#ff8a7a;border-color:#ff8a7a}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.btn[disabled]{opacity:.45;cursor:default;filter:none}
.warns{margin:12px 0 0;padding:0;list-style:none;font-size:13px;color:#ffb38a}
