/* Live pages: boards, profiles, events, tier lists. Uses the tokens in site.css. */
.pending [data-static] { visibility:hidden; }
.fakebar { position:sticky; top:0; z-index:60; background:#5a1f1f; color:#ffe0d6; text-align:center; font-size:14px; font-weight:600; padding:8px 16px; border-bottom:1px solid #a33; }
.fakebar a { color:#fff; }
.kicker { font-size:12px; color:var(--amber2); text-transform:uppercase; letter-spacing:.08em; font-weight:600; }
.kicker.priv { margin-bottom:10px; }
.lab { display:block; font-weight:600; color:#fff; margin-bottom:8px; }
textarea, .search input, .mk input, .mk select, .tedit select { font:inherit; color:var(--text); background:var(--ground); border:1px solid var(--line); border-radius:8px; }
textarea { width:100%; padding:10px 12px; font-family:'IBM Plex Mono',monospace; font-size:13px; resize:vertical; }
button.btn { font:inherit; font-weight:600; cursor:pointer; background:transparent; }
button.btn.primary { background:var(--amber); }
.box.ok { border-color:#3b6b4a; }
.search { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.search .lab { margin:0 6px 0 0; }
.search input { flex:1 1 200px; min-height:44px; padding:0 14px; }
.pad { padding:6px 22px 14px; }

/* leaderboards */
.lbgrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:24px; }
@media (max-width:760px) { .lbgrid { grid-template-columns:1fr; } }
.lb { background:var(--panel2); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.lb.hot { background:var(--panel); border-color:var(--amber); }
.lbh { padding:18px 22px 10px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 10px; align-items:baseline; }
.lbh h2 a { color:#fff; text-decoration:none; } .lbh h2 a:hover { color:var(--amber2); }
.lbf { padding:10px 22px 16px; }
.lbf .zl { display:inline-flex; gap:8px; align-items:center; margin-left:4px; }
.lbf select { font:inherit; font-size:14px; min-height:36px; padding:0 8px; border-radius:8px; border:1px solid var(--line); background:var(--ground); color:var(--text); }
table.rank td { border-top:1px solid var(--line2); border-bottom:0; padding:10px 16px; }
table.rank td:first-child { padding-left:22px; } table.rank td:last-child { padding-right:22px; }
.rk { width:36px; color:var(--muted); font-weight:700; } .rk.r1 { color:var(--amber2); } .rk.r2, .rk.r3 { color:var(--soft); }
a.who { font-weight:600; color:#fff; text-decoration:none; } a.who:hover { color:var(--amber2); }

/* profile */
.phead { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-top:10px; padding:22px 26px; background:var(--panel); border:1px solid var(--line); border-radius:14px; }
.phead h1 { margin-top:2px; }
.psub { margin-top:4px; color:var(--soft); font-size:15px; }
.pstats { display:flex; flex-wrap:wrap; gap:18px 26px; }
.pstats div { display:flex; flex-direction:column; }
.pstats span { font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.pstats b { font-family:Fraunces,Georgia,serif; font-size:26px; font-weight:500; color:#fff; }
.pgrid { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:24px; }
@media (max-width:860px) { .pgrid { grid-template-columns:1fr; } }
.pct { display:inline-block; min-width:44px; text-align:center; padding:3px 10px; border-radius:6px; font-weight:600; }
.pct.p100 { background:#4d3f12; color:#ffe58a; } .pct.p99 { background:#4a2140; color:#ffb3e6; } .pct.p95 { background:#4d2d12; color:#ffc08a; }
.pct.p75 { background:#3b2a66; color:#d9c3ff; } .pct.p50 { background:#1f3a66; color:#a9cbff; } .pct.p25 { background:#1d4a2e; color:#a6e3b8; } .pct.p0 { background:#333a44; color:#d0d6de; }
.ng { margin-top:16px; font-size:16px; } .ng:first-of-type { margin-top:12px; }
.nl { list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:15px; }
.nl li { display:flex; justify-content:space-between; gap:10px; }
.nl li.on > :first-child { color:#fff; font-weight:600; } .nl li.on > :last-child { color:var(--soft); }
.nl li.off { color:#6f829b; }

/* tier lists */
.tiers { margin-top:12px; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.trow { display:flex; border-top:1px solid var(--line2); } .trow:first-child { border-top:0; }
.tl { flex:none; width:56px; display:flex; align-items:center; justify-content:center; font-family:Fraunces,Georgia,serif; font-size:24px; font-weight:700; color:#0b1526; }
.tz { flex:1; display:flex; flex-wrap:wrap; gap:6px; padding:10px 12px; background:var(--panel2); align-items:center; min-height:52px; }
.tchip { padding:4px 10px; border-radius:6px; background:var(--line2); color:var(--soft); text-decoration:none; font-size:14px; }
.tchip:hover { color:var(--amber2); }
.t-S { background:#ff7f7f; } .t-A { background:#ffbf7f; } .t-B { background:#ffdf7f; } .t-C { background:#bfff7f; } .t-D { background:#7fbfff; } .t-F { background:#b9a7ff; }
.tb { display:inline-flex; align-items:center; justify-content:center; min-width:26px; height:24px; padding:0 6px; border-radius:6px; font-weight:700; font-size:14px; color:#0b1526; vertical-align:middle; }
.tedit { margin-top:14px; }
.tedit summary { cursor:pointer; color:var(--amber); font-weight:600; min-height:32px; }
.tgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:8px; margin-top:10px; }
.tz-pick { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 10px; border:1px solid var(--line2); border-radius:8px; background:var(--panel2); font-size:14px; }
.tz-pick.fished { border-color:var(--line); }
.tz-pick small { color:var(--amber2); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.tz-pick select { min-height:34px; padding:0 6px; }

/* events */
.evhead { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,460px); align-items:center; gap:40px; }
.evart { width:100%; aspect-ratio:856/768; object-fit:cover; border-radius:14px; border:1px solid var(--line); }
.evlinks { display:flex; flex-wrap:wrap; gap:8px 24px; margin:18px 0 0; font-weight:600; }
@media (max-width:860px) { .evhead { grid-template-columns:1fr; } .evart { order:-1; aspect-ratio:16/9; } }
.ecards { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:16px; margin-top:12px; }
.ecard.hot { background:var(--panel); border-color:var(--amber); }
.ecard h3 a { color:#fff; text-decoration:none; } .ecard h3 a:hover { color:var(--amber2); }
a.ecard { display:flex; flex-direction:column; padding:0; overflow:hidden; text-decoration:none; color:var(--soft); transition:border-color .15s, transform .15s; }
a.ecard:hover { border-color:var(--amber); transform:translateY(-2px); }
a.ecard h3 { color:#fff; margin:4px 0 6px; } a.ecard:hover h3 { color:var(--amber2); }
a.ecard p { margin:0; }
.ecart { width:100%; aspect-ratio:2048/868; object-fit:cover; display:block; border-bottom:1px solid var(--line); }
.ecdate { display:flex; align-items:center; justify-content:center; gap:18px; background:radial-gradient(120% 140% at 50% 120%, #1f3550 0%, #12213a 55%, #0e1a2e 100%); color:#fff; font-family:Fraunces, Georgia, serif; font-size:44px; font-weight:700; line-height:1; }
.ecdate span { display:flex; flex-direction:column; align-items:center; gap:6px; }
.ecdate small { font-family:inherit; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); font-weight:700; }
.wbadge { display:inline-flex; align-items:center; gap:5px; padding:2px 9px 2px 3px; border-radius:999px; font-weight:700; font-size:13px; border:1px solid currentColor; background:rgba(0,0,0,.25); }
.wbadge img { width:20px; height:20px; border-radius:50%; }
.lbf .wbadge { padding:1px 8px; font-size:12px; }
.wbadge.uncommon { color:#1eff00; } .wbadge.rare { color:#0070dd; } .wbadge.epic { color:#a335ee; } .wbadge.legendary { color:#ff8000; }
.mday { padding:12px 18px; border-top:1px solid var(--line2); } .mday p { margin:4px 0 0; }
.ecicon { width:64px; height:64px; border-radius:10px; border:2px solid var(--amber); box-shadow:0 6px 18px rgba(0,0,0,.45); }
.ecdate i { font-style:normal; font-size:14px; color:var(--soft); font-weight:500; }
.ecbody { padding:18px 20px; display:flex; flex-direction:column; flex:1; }
.ecfoot { margin-top:auto !important; padding-top:12px; font-size:14px; }
.echips .pill { white-space:normal; }
.echips { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.egrid { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:24px; align-items:start; margin-top:6px; }
@media (max-width:860px) { .egrid { grid-template-columns:1fr; } }
.hotbox { background:var(--panel); border-color:var(--amber); display:flex; flex-direction:column; gap:12px; }
.hotbox b { color:#fff; } .hotbox ol { margin:0; padding-left:20px; color:var(--soft); }
.estr { display:block; font-size:12px; background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:10px 12px; color:var(--amber2); word-break:break-all; max-height:96px; overflow:auto; }
.estrbox { margin-top:16px; display:flex; flex-direction:column; gap:10px; }
.checks { margin:10px 0 0; padding-left:18px; color:var(--soft); }
.barline { font-family:'IBM Plex Mono',monospace; font-size:13px; background:var(--ground); border:1px solid var(--wood); border-radius:6px; padding:10px 12px; color:var(--amber2); white-space:nowrap; overflow-x:auto; margin-top:10px; }
.calh { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.calh .btn { padding:6px 14px; }
.cal { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; margin-top:12px; }
.cdh { font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; padding:4px 6px; }
.cd { min-height:64px; background:var(--panel2); border:1px solid var(--line2); border-radius:8px; padding:6px; display:flex; flex-direction:column; gap:4px; font-size:12px; overflow:hidden; }
.cd.blank { background:transparent; border-color:transparent; }
.cd.today { border-color:var(--amber); }
.dn { color:var(--muted); font-weight:600; }
.ce { display:block; padding:2px 6px; border-radius:4px; background:#2a2314; color:var(--amber2); text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ce.bliz { background:#16304f; color:#a9cbff; }
.key.ev { background:var(--amber); } .key.bz { background:#a9cbff; } .key.wk { background:#a6e3b8; }
.cd { position:relative; }
.cdch { position:absolute; top:5px; right:5px; line-height:0; }
.cdch img { width:22px; height:22px; border-radius:5px; border:1px solid var(--line); opacity:.85; }
.cdch:hover img { opacity:1; border-color:var(--amber); }
.cwk { grid-column:1 / -1; }
.cwk:empty { display:none; }
.cwk a { display:block; margin-top:6px; padding:3px 8px; border-radius:4px; background:#15302a; color:#a6e3b8; font-size:12px; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cwk a span { font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-right:8px; font-size:11px; }
.cwk a:hover { color:#d4f5df; }
@media (max-width:640px) { .cd { min-height:60px; } .ce { font-size:0; padding:0; height:6px; } }
.mk { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px 16px; margin-top:16px; }
.mk label { display:flex; flex-direction:column; gap:6px; font-weight:600; color:#fff; font-size:14px; }
.mk input, .mk select { min-height:44px; padding:0 12px; font-weight:400; }
.mkgo { display:flex; align-items:flex-end; }
.mkgo .btn { width:100%; }
.lvl { display:inline-block; min-width:30px; text-align:center; padding:1px 6px; margin-right:6px; border-radius:6px; background:#2a2314; color:var(--amber2); font-size:13px; }
.lows li > :last-child { white-space:nowrap; }

/* winners strip */
.winners { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-top:14px; }
.win { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px 18px; }
.win .wn { display:block; margin-top:4px; font-family:Fraunces,Georgia,serif; font-size:17px; font-weight:700; color:#fff; text-decoration:none; }
.win .wn:hover { color:var(--amber2); }
.win ol { margin:8px 0 0; padding-left:20px; color:var(--soft); }
.win p { margin:8px 0 0; }
/* trophy case */
.trophies { display:flex; flex-wrap:wrap; gap:12px; margin-top:12px; }
.trophy { width:132px; display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 10px; background:var(--panel2); border:1px solid var(--line); border-radius:12px; text-decoration:none; text-align:center; }
.trophy img { width:56px; height:56px; border-radius:8px; border:3px solid var(--line); background:#000; object-fit:cover; }
.trophy .tico { position:relative; line-height:0; }
.trophy .stack { position:absolute; right:4px; bottom:3px; font-size:16px; font-weight:700; line-height:1; color:#fff; text-shadow:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; }
.trophy .tn { font-size:13px; font-weight:600; color:#fff; line-height:1.25; height:2.5em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.trophy .ty { font-size:12px; color:var(--muted); max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trophy:hover { border-color:var(--amber); }
.tr-gold img { border-color:#e8b923; box-shadow:0 0 12px rgba(232,185,35,.45); } .tr-gold .ty { color:#ffd27a; }
.tr-silver img { border-color:#c7ccd6; } .tr-bronze img { border-color:#c8814a; }
.tr-ribbon img { border-color:#4f7a5c; border-style:dashed; }
.tr-count.uncommon img, .rw-count img { border-color:#1eff00; } .tr-count.rare img { border-color:#0070dd; } .tr-count.epic img { border-color:#a335ee; } .tr-count.legendary img { border-color:#ff8000; box-shadow:0 0 12px rgba(255,128,0,.45); }
.tr-count.uncommon .ty { color:#1eff00; } .tr-count.rare .ty { color:#4aa3ff; } .tr-count.epic .ty { color:#c27cf5; } .tr-count.legendary .ty { color:#ff9d3a; }
.tr-badge img { border-color:#6fa3c8; }
.tr-badge.founding img, .rw-founding img { border-color:#ffd27a; box-shadow:0 0 0 2px rgba(255,210,122,.35), 0 0 14px rgba(255,210,122,.4); } .tr-badge.founding .ty { color:#ffd27a; } .tr-badge .ty { color:#9cc7e4; }
/* quest rewards, laid out like the quest log's reward slots */
.reward { display:flex; align-items:center; gap:10px; margin:8px 0; padding:6px 10px 6px 6px; max-width:320px;
  background:rgba(0,0,0,.25); border:1px solid var(--line); border-radius:6px; }
.reward img { width:48px; height:48px; border:2px solid #6fa3c8; border-radius:4px; }
.rw-gold img { border-color:#e8b923; box-shadow:0 0 10px rgba(232,185,35,.45); } .rw-silver img { border-color:#c7ccd6; }
.rw-bronze img { border-color:#c8814a; } .rw-ribbon img { border-color:#4f7a5c; border-style:dashed; }
.reward b { display:block; color:#ffd27a; } .reward span { font-size:12px; color:var(--muted); }
/* Hal's telling of an event */
.story { margin:10px 0 14px; padding-left:14px; border-left:3px solid var(--amber); font-style:italic; color:var(--soft); }
.story p { margin:0 0 8px; }
/* community event tally */
.tallyh { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.tallyh b { font-size:22px; color:#ffd27a; } .tallyh b .muted { font-size:14px; font-weight:400; }
.bar { height:14px; margin-top:10px; background:rgba(0,0,0,.35); border:1px solid var(--line); border-radius:7px; overflow:hidden; }
.bar { position:relative; }
.bar span { display:block; height:100%; background:linear-gradient(90deg,#6fa3c8,#ffd27a); }
.bar .mark { position:absolute; top:0; bottom:0; width:2px; margin-left:-1px; background:rgba(255,255,255,.35); }
.miles { list-style:none; margin:12px 0 0; padding:0; } .miles li { margin:4px 0; color:var(--muted); }
.miles li b { display:inline-block; min-width:56px; } .miles li.hit { color:var(--soft); } .miles li.hit b { color:#ffd27a; } .miles li.hit::before { content:'✓  '; color:#ffd27a; }
/* event painting */
.eart { margin:10px 0 18px; line-height:0; }
.eart img { width:100%; height:auto; aspect-ratio:2048/868; object-fit:cover; border-radius:8px; border:1px solid var(--line); }
/* where-to-fish map on event pages */
.emapimg { position:relative; margin-top:10px; line-height:0; }
.emapimg img { width:100%; height:auto; border-radius:6px; border:1px solid var(--line); }
.espot { position:absolute; width:44px; height:44px; margin:-22px 0 0 -22px; border:3px solid #ffd27a; border-radius:50%;
  box-shadow:0 0 0 2px rgba(0,0,0,.55), 0 0 14px rgba(255,210,122,.6); }
.espot b { position:absolute; top:-12px; right:-12px; width:22px; height:22px; line-height:22px; text-align:center; font-size:12px;
  border-radius:50%; background:#ffd27a; color:#1b1408; }
.espots { margin:12px 0 0; padding-left:22px; } .espots li { margin:3px 0; }
/* event needs list */
.objh { margin:14px 0 4px; font-size:16px; }
.needs { margin:10px 0 0; padding-left:20px; color:var(--soft); }

/* A cup: one row per city, ranked by fish per angler. */
.cupr { margin-top:14px; } .cupr .bar { margin-top:6px; }
.cuph { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:4px 12px; }
.cuph > span b { color:#ffd27a; font-size:18px; }
.cupr.won .bar span { background:linear-gradient(90deg,#c9962e,#ffd27a); }
.cupt { margin:6px 0 0; font-size:13px; }
.tr-badge.won img { border-color:#ffd27a; box-shadow:0 0 0 2px rgba(255,210,122,.35); } .tr-badge.won .ty { color:#ffd27a; }
.tr-title img, .rw-title img { border-color:#b58cd8; } .tr-title .ty { color:#d2b4ee; }
.tr-title.won img { border-color:#ffd27a; } .tr-title.won .ty { color:#ffd27a; }
.lbauto { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }