:root{
  --bg:#0f0d0c;--bg2:#171412;--card:#1c1815;--line:#2f2924;--ink:#f1e9dc;--soft:#c9bba6;--muted:#8d8173;
  --candle:#e8b866;--candle2:#f6d89a;--rose:#c98a7d;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--sans:Inter,system-ui,sans-serif}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--ink);font:15px/1.5 var(--sans);
  background:radial-gradient(1200px 500px at 15% -10%,rgba(232,184,102,.10),transparent 60%),
             radial-gradient(900px 500px at 100% 0,rgba(201,138,125,.06),transparent 60%),var(--bg)}
a{color:inherit}

.top{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;padding:34px 48px 18px;flex-wrap:wrap}
.brand{display:flex;gap:18px;align-items:center}
h1{margin:0;font:500 46px/1 var(--serif);letter-spacing:.5px;color:var(--ink)}
.sub{margin:8px 0 0;color:var(--soft);font:italic 400 19px/1.3 var(--serif)}
.flame{width:26px;height:52px;position:relative;flex:none}
.flame i{position:absolute;left:50%;bottom:10px;width:16px;height:30px;margin-left:-8px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;
  background:radial-gradient(ellipse at 50% 70%,#fff6dc 0 18%,var(--candle2) 38%,var(--candle) 70%,#d58f45 100%);
  box-shadow:0 0 22px 6px rgba(232,184,102,.35);animation:flick 2.8s ease-in-out infinite;transform-origin:50% 100%}
.flame::after{content:"";position:absolute;left:50%;bottom:0;width:12px;height:12px;margin-left:-6px;background:#e9dfcf;border-radius:2px}
@keyframes flick{0%,100%{transform:scale(1,1) rotate(-1deg)}30%{transform:scale(.95,1.06) rotate(1.5deg)}60%{transform:scale(1.04,.96) rotate(-.5deg)}}
.stats{display:flex;gap:30px}
.stat{text-align:right}
.stat b{display:block;font:500 34px/1 var(--serif);color:var(--candle2)}
.stat span{color:var(--muted);font-size:12px;letter-spacing:.6px;text-transform:uppercase}

nav{display:flex;gap:6px;padding:0 48px;border-bottom:1px solid var(--line);flex-wrap:wrap}
nav button{background:none;border:0;color:var(--muted);padding:12px 16px;font:500 20px var(--serif);cursor:pointer;border-bottom:2px solid transparent}
nav button:hover{color:var(--soft)}
nav button.on{color:var(--candle2);border-bottom-color:var(--candle)}
main{padding:26px 48px 60px;max-width:1900px;margin:0 auto}
.tab{display:none}.tab.on{display:block;animation:fade .4s ease}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1}}
.preview{background:rgba(232,184,102,.07);border:1px solid rgba(232,184,102,.25);color:var(--soft);padding:9px 14px;border-radius:8px;font-size:13px;margin:0 0 20px}

/* hero */
.hero{display:grid;grid-template-columns:300px minmax(0,1fr) minmax(0,600px);gap:36px;align-items:center;background:linear-gradient(120deg,rgba(28,24,21,.9),rgba(23,20,18,.6));
  border:1px solid var(--line);border-radius:14px;padding:26px 34px;margin-bottom:30px;position:relative;overflow:hidden;cursor:pointer}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(500px 300px at 0 50%,rgba(232,184,102,.10),transparent 70%);pointer-events:none}
.hero .ph,.hero img{width:300px;height:380px;border-radius:10px;object-fit:cover;filter:grayscale(.35) sepia(.15);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.hero .kick{color:var(--candle);font-size:12.5px;letter-spacing:2px;text-transform:uppercase}
.hero h2{font:500 64px/1.02 var(--serif);margin:10px 0 8px}
.hero .life{font:italic 400 24px var(--serif);color:var(--soft)}
.hero .who{font:400 21px/1.45 var(--serif);color:var(--ink);margin:16px 0 0;max-width:760px}
.alsogrid{align-self:stretch;display:flex;flex-direction:column;border-left:1px solid var(--line);padding-left:30px}
.mini{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 16px;margin-top:12px}
.m{cursor:pointer;text-align:center}
.m .mf{aspect-ratio:1/1;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--card)}
.m img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.9);transition:filter .4s}
.m:hover img{filter:none}
.m .ph{font-size:26px}
.m b{display:block;font:500 17px/1.15 var(--serif);margin-top:7px}
.m span{color:var(--muted);font:italic 14px var(--serif)}

/* wall */
.bar{display:flex;gap:16px;align-items:center;margin-bottom:22px;flex-wrap:wrap;font-size:13.5px}
input:not([type=checkbox]){background:var(--bg2);border:1px solid var(--line);color:var(--ink);padding:10px 14px;border-radius:8px;min-width:340px;font:inherit}
input:focus{outline:none;border-color:rgba(232,184,102,.5)}
.chk{color:var(--soft);display:flex;gap:7px;align-items:center;cursor:pointer}
button{background:var(--bg2);border:1px solid var(--line);color:var(--ink);padding:9px 16px;border-radius:8px;cursor:pointer;font:500 13.5px var(--sans)}
button:hover{border-color:rgba(232,184,102,.5)}
.muted{color:var(--muted)}
.month{display:flex;align-items:baseline;gap:14px;margin:34px 0 16px;border-bottom:1px solid var(--line);padding-bottom:8px}
.month h3{margin:0;font:500 30px var(--serif);color:var(--ink)}
.month span{color:var(--muted);font:italic 18px var(--serif)}
.wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:22px 18px}
.p{cursor:pointer;text-align:center}
.p .frame{position:relative;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:var(--card);border:1px solid var(--line);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.p img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.02) brightness(.92);transition:filter .5s ease,transform .6s ease}
.p:hover img{filter:grayscale(0) brightness(1);transform:scale(1.03)}
.p:hover .frame{border-color:rgba(232,184,102,.45)}
.p .soon{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 7px;font:italic 15px var(--serif);color:var(--candle2);
  background:linear-gradient(transparent,rgba(10,8,7,.85))}
.p h4{margin:11px 0 0;font:500 21px/1.15 var(--serif)}
.p .yrs{color:var(--soft);font:italic 16px var(--serif);margin-top:2px}
.p .who{color:var(--muted);font-size:12.5px;margin-top:4px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:linear-gradient(160deg,#241f1b,#171412);
  color:var(--soft);font:500 44px var(--serif);letter-spacing:2px}
.more{margin:34px auto 0;display:block;font:500 18px var(--serif);padding:10px 26px}

/* tribute */
.veil{position:fixed;inset:0;background:rgba(8,6,5,.78);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9;padding:30px}
.veil[hidden]{display:none}
.tribute{background:var(--bg2);border:1px solid var(--line);border-radius:16px;max-width:1040px;width:100%;display:grid;grid-template-columns:340px 1fr;
  overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.6);animation:fade .3s ease;max-height:90vh}
.tribute .pic{background:#0c0a09}
.tribute .pic img,.tribute .pic .ph{width:100%;height:100%;min-height:440px;object-fit:cover}
.tribute .body{padding:34px 38px;overflow:auto;position:relative}
.tribute .x{position:absolute;right:16px;top:14px;background:none;border:0;color:var(--muted);font-size:26px;padding:4px 10px}
.tribute h2{font:500 50px/1.05 var(--serif);margin:0}
.tribute .life{font:italic 22px var(--serif);color:var(--soft);margin-top:6px}
.tribute .who{font:400 20px/1.5 var(--serif);margin:18px 0 20px}
.tribute dl{display:grid;grid-template-columns:130px 1fr;gap:8px 16px;margin:0;font-size:14px}
.tribute dt{color:var(--muted)}
.tribute dd{margin:0;color:var(--soft)}
.tribute .acts{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap;align-items:center}
.tribute .acts a{text-decoration:none}
.candle-btn.lit{border-color:rgba(232,184,102,.6);color:var(--candle2)}
.tribute .odds{margin-top:22px;color:var(--muted);font-size:12.5px;border-top:1px solid var(--line);padding-top:12px}

/* tables (still with us, beating, picks) */
.note{color:var(--soft);max-width:860px;margin:0 0 20px;font:400 19px/1.45 var(--serif)}
.small{font-size:15px;margin-top:30px;color:var(--muted)}
.table{display:flex;flex-direction:column;gap:6px}
.tr{display:grid;grid-template-columns:54px 1fr 60px 180px 110px;gap:16px;align-items:center;padding:8px 12px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.tr.h{background:none;border:0;color:var(--muted);font-size:12px;letter-spacing:.6px;text-transform:uppercase;padding:0 12px}
.tr img,.tr .ph{width:54px;height:66px;border-radius:6px;object-fit:cover;font-size:18px}
.tr .nm{font:500 20px var(--serif)}.tr .nm a{text-decoration:none}.tr .ds{color:var(--muted);font-size:12.5px}
.meter{height:6px;background:#2a2420;border-radius:4px;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--candle),var(--rose))}
.gone{color:var(--rose);font-style:italic}
.score{color:var(--candle2);font:500 20px var(--serif)}
.yr{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin-bottom:12px;font-size:14px;color:var(--soft)}
.yr b{font:500 22px var(--serif);color:var(--candle2)}
.bands{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.band{background:#231e1a;padding:6px 10px;border-radius:6px;font-size:12.5px;color:var(--soft)}
.mults{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;font-size:13.5px}
.mults div{background:var(--card);border:1px solid var(--line);padding:8px 12px;border-radius:8px;display:flex;justify-content:space-between;color:var(--soft)}
h3{font:500 28px var(--serif);color:var(--ink);margin:30px 0 10px}
footer{padding:18px 48px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}
@media (max-width:900px){.top,nav,main{padding-left:18px;padding-right:18px}.hero,.tribute{grid-template-columns:1fr}.alsogrid{border:0;padding:0}.hero .ph,.hero img{width:100%;height:340px}.hero h2{font-size:44px}}
.about{display:grid;grid-template-columns:1fr 1fr;gap:56px;max-width:1500px}
.about h2{font:500 30px var(--serif);color:var(--candle2);margin:6px 0 10px}
.about p,.about li{font:400 19px/1.55 var(--serif);color:var(--ink)}
.about p{margin:0 0 20px}
.about ul{margin:0 0 20px;padding-left:20px}.about li{margin-bottom:10px}
.about b{font-weight:600;color:var(--soft)}
.about a{color:var(--candle2)}
.credit{margin-top:14px;color:var(--muted);font-size:12px}
.credit a{color:var(--soft)}
.hero .credit{margin-top:22px}
@media (max-width:900px){.about{grid-template-columns:1fr;gap:10px}}
.give{margin-top:24px;padding-top:16px;border-top:1px solid var(--line)}
.give .gk{color:var(--candle);font-size:12px;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px}
.gbtn{display:inline-flex;flex-direction:column;gap:2px;margin:0 10px 10px 0;padding:10px 16px;border-radius:10px;text-decoration:none;
  background:rgba(232,184,102,.08);border:1px solid rgba(232,184,102,.35);transition:background .2s,border-color .2s}
.gbtn:hover{background:rgba(232,184,102,.16);border-color:rgba(232,184,102,.7)}
.gbtn b{font:500 18px var(--serif);color:var(--candle2)}
.gbtn span{font-size:12px;color:var(--muted)}
.vigil{display:flex;align-items:center;gap:16px;margin:22px 0 4px}
.candle{position:relative;width:26px;height:58px;flex:none}
.candle b{position:absolute;left:4px;bottom:0;width:18px;height:34px;border-radius:3px 3px 2px 2px;background:linear-gradient(90deg,#d9cdb8,#f1e9dc 45%,#cbbfa9)}
.candle::after{content:"";position:absolute;left:12px;bottom:34px;width:2px;height:7px;background:#3a2f26}
.candle .fl{position:absolute;left:6px;bottom:38px;width:14px;height:22px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;
  background:radial-gradient(ellipse at 50% 70%,#fff6dc 0 18%,var(--candle2) 38%,var(--candle) 70%,#d58f45 100%);
  box-shadow:0 0 18px 5px rgba(232,184,102,.35);transform-origin:50% 100%;opacity:0;transform:scale(.2);transition:opacity .6s,transform .6s}
.candle.on .fl{opacity:1;transform:scale(1);animation:flick 2.6s ease-in-out .6s infinite}
.vc{font:italic 19px var(--serif);color:var(--soft)}
.vc b{font-style:normal;color:var(--candle2);font-weight:600}
.cc{position:absolute;top:8px;right:8px;display:flex;align-items:center;gap:5px;padding:3px 8px 3px 6px;border-radius:12px;
  background:rgba(10,8,7,.72);color:var(--candle2);font:600 12px var(--sans)}
.cc .fl{width:7px;height:11px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;background:radial-gradient(ellipse at 50% 70%,#fff6dc 0 20%,var(--candle) 70%);box-shadow:0 0 6px 2px rgba(232,184,102,.4)}
.known{margin-top:22px}
.known .gk,.give .gk{color:var(--candle);font-size:12px;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
.known ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}
.known li{font:400 18px/1.35 var(--serif);color:var(--ink)}
.known li a{color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(232,184,102,.35)}
.known li a:hover{color:var(--candle2);border-bottom-color:var(--candle2)}
.known li span{color:var(--muted);font-style:italic;font-size:15px}
/* tribute v2: fixed size, three columns, nothing scrolls on a 1920x919 screen */
.tribute{max-width:1400px;width:94vw;height:min(760px,88vh);max-height:none;grid-template-columns:380px minmax(0,1fr) 380px}
.tribute.narrow{max-width:1060px;grid-template-columns:380px minmax(0,1fr)}
.tribute .pic{position:relative;display:flex;flex-direction:column;min-height:0}
.tribute .pic img,.tribute .pic .ph{flex:1;min-height:0;width:100%;height:auto}
.tribute .pic .credit{margin:0;padding:8px 14px;font-size:11px;background:#0c0a09;line-height:1.35}
.tribute .body{padding:30px 34px;overflow:auto}
.tribute h2{font-size:46px}
.tribute .who{font-size:19px;margin:12px 0 16px}
.tribute dl{grid-template-columns:96px 1fr;font-size:13.5px;gap:6px 14px}
.tribute .vigil{margin:18px 0 4px}
.tribute .acts{margin-top:14px}
.tribute .odds{margin-top:18px}
.tribute .side{border-left:1px solid var(--line);padding:30px 28px;overflow:auto;background:rgba(255,255,255,.012)}
.known{margin:0 0 22px}
.known ul{display:flex;flex-direction:column;gap:0;grid-template-columns:none}
.known li{display:flex;align-items:baseline;gap:12px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font:400 17px/1.3 var(--serif)}
.known li a,.known li em{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:normal;color:var(--ink);border:0;text-decoration:none}
.known li a:hover{color:var(--candle2)}
.known li a::after{content:" \2197";font-size:12px;color:var(--muted)}
.known li span{flex:none;width:40px;text-align:right;color:var(--muted);font:italic 15px var(--serif)}
.give{margin-top:0;padding-top:0;border-top:0}
.gbtn{display:flex;margin:0 0 10px;width:100%}
@media (max-width:1200px){.tribute{grid-template-columns:300px minmax(0,1fr);height:auto;max-height:92vh;overflow:auto}.tribute .side{grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}}
@media (max-width:900px){.tribute,.tribute.narrow{grid-template-columns:1fr}.tribute .pic img,.tribute .pic .ph{height:320px;flex:none}}
.tr{grid-template-columns:54px minmax(0,1fr) 60px 180px 110px 110px}
.tr.pk{grid-template-columns:54px minmax(0,1fr) 60px 180px 110px}
.chips{display:flex;gap:6px}
.chips button{border-radius:20px;padding:8px 16px;font:500 16px var(--serif);color:var(--soft)}
.chips button.on{background:rgba(232,184,102,.14);border-color:rgba(232,184,102,.55);color:var(--candle2)}
.lg{display:inline-block;margin-left:10px;padding:1px 8px;border-radius:10px;font:600 10.5px var(--sans);letter-spacing:.8px;text-transform:uppercase;
  color:var(--candle2);border:1px solid rgba(232,184,102,.45);vertical-align:3px}
.watch{padding:6px 12px;font-size:12.5px}
.watch.on{border-color:rgba(232,184,102,.6);color:var(--candle2)}
.tr.hit{border-color:rgba(201,138,125,.5)}
.p.mine .frame{border-color:rgba(232,184,102,.6);box-shadow:0 0 0 1px rgba(232,184,102,.25),0 10px 30px rgba(232,184,102,.12)}
.p.mine .cc{background:rgba(232,184,102,.25)}
.p.mine img{filter:none}
#jump{background:var(--bg2);border:1px solid var(--line);color:var(--ink);padding:9px 12px;border-radius:8px;font:500 15px var(--serif);cursor:pointer}
#jump:focus{outline:none;border-color:rgba(232,184,102,.5)}
.month{scroll-margin-top:10px}
.passed{display:flex;align-items:center;gap:14px;background:rgba(232,184,102,.09);border:1px solid rgba(232,184,102,.4);border-radius:10px;
  padding:12px 16px;margin:0 0 20px;font:400 19px/1.4 var(--serif);color:var(--ink);position:relative}
.passed a{color:var(--candle2)}
.passed .fl{flex:none;width:14px;height:22px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;
  background:radial-gradient(ellipse at 50% 70%,#fff6dc 0 18%,var(--candle2) 38%,var(--candle) 70%,#d58f45 100%);box-shadow:0 0 14px 4px rgba(232,184,102,.35);animation:flick 2.6s ease-in-out infinite}
.passed .x{margin-left:auto;background:none;border:0;color:var(--muted);font-size:22px;padding:0 6px}
