:root{--bg:#050607;--panel:#0b0d0e;--gold:#c8a35a;--pale:#ead9aa;--text:#eee7d7;--muted:#aaa292;--line:rgba(200,163,90,.3)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:radial-gradient(circle at 50% 0,rgba(91,63,122,.18),transparent 32rem),var(--bg);font-family:Georgia,"Times New Roman",serif;line-height:1.5}a{color:inherit;text-decoration:none}button{font:inherit}header{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:1rem clamp(1rem,4vw,3rem);border-bottom:1px solid var(--line);background:rgba(4,5,6,.93);backdrop-filter:blur(12px)}header nav{display:flex;gap:clamp(.7rem,3vw,2rem)}header a{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em}.brand{color:var(--pale)}.hero{min-height:70vh;display:grid;place-content:center;justify-items:center;text-align:center;padding:6rem 1rem;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(3,4,5,.58),rgba(3,4,5,.94)),url("assets/cards/bf-001.webp") center 25%/cover;opacity:.35;mask-image:linear-gradient(#000 75%,transparent)}.hero>*{position:relative}.hero h1,.title h2{margin:.2rem 0;color:var(--pale);text-transform:uppercase;letter-spacing:.12em}.hero h1{font-size:clamp(3.5rem,12vw,8rem);line-height:.9}.hero>p:not(.kicker){color:#d0c8ba;font-size:1.15rem;letter-spacing:.06em}.kicker{margin:0 0 .55rem;color:var(--gold);text-transform:uppercase;letter-spacing:.23em;font-size:.7rem}.button{display:inline-block;border:1px solid #d5b66d;background:linear-gradient(#d5b66d,#947028);color:#090806;padding:.75rem 1.1rem;text-transform:uppercase;letter-spacing:.13em;font-size:.73rem;font-weight:bold;cursor:pointer}.button:hover{filter:brightness(1.1)}.rules{max-width:1160px;margin:-1.5rem auto 0;position:relative;display:grid;grid-template-columns:repeat(4,1fr);background:#090a0b;border:1px solid var(--line)}.rules span{padding:1rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.67rem;border-right:1px solid var(--line)}.rules span:last-child{border:0}.rules b{color:var(--gold);font-size:1.4rem;margin-right:.5rem}.section{max-width:1320px;margin:auto;padding:5.5rem 1rem}.title{text-align:center;max-width:760px;margin:0 auto 2rem}.title h2{font-size:clamp(2rem,5vw,3.4rem)}.title p:last-child{color:var(--muted)}.game{border:1px solid var(--line);background:rgba(7,8,9,.9);box-shadow:0 30px 100px #000}.toolbar{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:1rem;border-bottom:1px solid var(--line)}.toolbar>p{margin:0;text-align:center;color:var(--muted)}.toolbar>strong{color:var(--pale)}.score{display:grid;grid-template-columns:1fr auto 1fr;padding:.55rem 1rem;background:#040505;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem}.score span:nth-child(2){color:var(--muted);text-align:center}.score span:last-child{text-align:right}.score b{color:var(--pale);font-size:1rem}.board{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.lane{min-width:0;background:radial-gradient(circle,rgba(91,63,122,.09),transparent 65%),#090b0c;padding:.7rem}.lane.selectable{cursor:pointer}.lane.selectable:hover{box-shadow:inset 0 0 0 2px var(--gold)}.lane h3{margin:.1rem 0 .5rem;color:var(--pale);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}.side{min-height:126px;border:1px solid rgba(255,255,255,.08);padding:.4rem;margin-top:.45rem}.side>span{color:var(--muted);font-size:.58rem;text-transform:uppercase;letter-spacing:.12em}.played{display:flex;gap:.3rem;flex-wrap:wrap;min-height:88px;align-items:end}.mini{width:clamp(44px,5.5vw,68px);position:relative}.mini img{display:block;width:100%;aspect-ratio:63/88;object-fit:cover;border:1px solid var(--line)}.mini b{position:absolute;right:2px;bottom:2px;background:#050505;border:1px solid var(--gold);padding:1px 4px;font-size:.62rem}.empty{margin:auto;color:rgba(255,255,255,.2);font-style:italic}.hand-head{display:flex;justify-content:space-between;align-items:end;padding:1rem 1rem 0}.hand-head h3{margin:0;color:var(--pale);text-transform:uppercase}.hand-head>p{color:var(--muted);font-size:.75rem}.hand{display:flex;gap:.7rem;overflow-x:auto;padding:1rem;min-height:225px}.hand-card{flex:0 0 clamp(115px,14vw,160px);border:0;padding:0;background:transparent;cursor:pointer;position:relative;transition:.2s}.hand-card:hover,.hand-card.selected{transform:translateY(-7px)}.hand-card.selected{filter:drop-shadow(0 0 9px var(--gold))}.hand-card img{width:100%;aspect-ratio:63/88;object-fit:cover;border:1px solid var(--line)}.hand-card span{position:absolute;inset:auto 4px 4px;background:rgba(3,4,5,.94);padding:4px;color:var(--pale);font-size:.62rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filters{display:flex;justify-content:center;flex-wrap:wrap;gap:.45rem;margin-bottom:1.4rem}.filters button{border:1px solid var(--line);background:#0a0b0c;color:var(--muted);padding:.5rem .8rem;text-transform:uppercase;letter-spacing:.09em;font-size:.63rem;cursor:pointer}.filters button.active{background:var(--gold);color:#090806}.archive{display:grid;grid-template-columns:repeat(6,1fr);gap:.9rem}.archive button{border:0;background:none;color:var(--pale);padding:0;cursor:zoom-in;transition:.2s;min-width:0}.archive button:hover{transform:translateY(-5px)}.archive img{width:100%;aspect-ratio:63/88;object-fit:cover;border:1px solid var(--line);box-shadow:0 10px 25px #000}.archive span{display:block;font-size:.65rem;margin-top:.35rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}dialog{width:min(92vw,850px);border:1px solid var(--gold);background:#08090a;color:var(--text);padding:1rem;grid-template-columns:minmax(220px,380px) 1fr;gap:1.4rem}dialog[open]{display:grid}dialog::backdrop{background:rgba(0,0,0,.9)}dialog img{width:100%;max-height:80vh;object-fit:contain}dialog div{align-self:center}dialog h2{color:var(--pale);text-transform:uppercase}.close{position:absolute;right:8px;top:3px;border:0;background:none;color:var(--pale);font-size:2rem;cursor:pointer}footer{display:flex;justify-content:space-between;padding:2rem;border-top:1px solid var(--line);color:var(--muted);font-size:.75rem}footer a{color:var(--gold)}@media(max-width:800px){.rules{margin-inline:1rem;grid-template-columns:1fr 1fr}.archive{grid-template-columns:repeat(4,1fr)}}@media(max-width:650px){header nav{flex-direction:column;gap:.25rem;text-align:right}.toolbar{grid-template-columns:1fr 1fr}.toolbar p{grid-column:1/-1;grid-row:2}.board{grid-template-columns:1fr}.side{min-height:100px}.played{min-height:65px}.hand-head{display:block}.archive{grid-template-columns:repeat(3,1fr);gap:.6rem}dialog[open]{grid-template-columns:1fr;overflow:auto}dialog img{max-height:58vh}footer{flex-direction:column;gap:.5rem}}

/* Shared R.A. Crawford site chrome */
.site-header{position:sticky;top:0;z-index:20;display:block;padding:0;background:rgba(5,5,5,.92);border-bottom:1px solid rgba(255,220,138,.08);backdrop-filter:blur(14px)}
.site-header .header-inner{max-width:1220px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 24px}
.site-header .brand{display:inline-flex;align-items:center;gap:12px;color:var(--gold-soft,#d9c28a);text-transform:uppercase;letter-spacing:.13em;font-size:.9rem}
.site-header .brand-mark{width:38px;height:38px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold)}
.site-header .brand small{display:block;font-size:.65rem;color:var(--muted);letter-spacing:.16em}
.site-header .site-nav{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.site-header .site-nav a{color:var(--text);opacity:.82;font-size:.82rem;text-transform:uppercase;letter-spacing:.18em}
.site-header .site-nav a:hover,.site-header .site-nav a.active{color:var(--gold);opacity:1}
.site-header .menu-button{display:none;border:1px solid rgba(255,212,136,.2);color:var(--gold);background:transparent;padding:10px 14px;font-size:1rem;cursor:pointer}
.blackfeather-hero{min-height:76vh}
.blackfeather-hero:before{background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.42) 42%,rgba(0,0,0,.9)),url("assets/cards/bf-001.webp") center 25%/cover;filter:saturate(.7) brightness(.62);opacity:1;mask-image:none}
.blackfeather-hero:after{background:radial-gradient(circle at center,transparent 0,rgba(0,0,0,.24) 38%,rgba(0,0,0,.9) 100%)}
.blackfeather-hero .hero-copy{max-width:980px}
.blackfeather-hero h1{font-size:clamp(3.5rem,10vw,7rem)}
.site-footer{display:block;padding:28px 24px;text-align:center;border-top:1px solid rgba(255,255,255,.07);color:var(--muted);font-size:.85rem;background:rgba(0,0,0,.45)}
.site-footer p{margin:0}
@media(max-width:980px){.site-header .site-nav{gap:14px}.site-header .site-nav a{font-size:.75rem}}
@media(max-width:780px){.site-header .header-inner{align-items:flex-start}.site-header .site-nav{display:none;width:100%;flex-direction:column;align-items:flex-start;padding-top:16px}.site-header .site-nav.open{display:flex}.site-header .menu-button{display:block}}

/* Larger playable cards and a readable Blackwing turn sequence. */
.hand{gap:1rem;min-height:315px;padding:1.15rem}
.hand-card{flex-basis:clamp(165px,19vw,220px)}
.hand-card span{padding:6px;font-size:.72rem}
.mini{width:clamp(58px,7vw,86px)}
.blackwing-reveal{position:fixed;z-index:100;inset:50% auto auto 50%;display:grid;justify-items:center;gap:.45rem;width:min(86vw,330px);padding:1rem;background:rgba(5,6,7,.98);border:1px solid var(--gold);box-shadow:0 0 0 100vmax rgba(0,0,0,.72),0 24px 80px #000;transform:translate(-50%,-50%);animation:blackwingReveal .35s ease-out both;pointer-events:none}
.blackwing-reveal span,.blackwing-reveal small{color:var(--gold);text-transform:uppercase;letter-spacing:.16em;font-size:.68rem}
.blackwing-reveal img{display:block;width:clamp(180px,23vw,250px);aspect-ratio:63/88;object-fit:cover;border:1px solid var(--line)}
.blackwing-reveal strong{color:var(--pale);text-align:center;text-transform:uppercase;letter-spacing:.08em}
.blackwing-arrival{animation:blackwingArrival .9s ease-out}
.game-outcome{position:fixed;z-index:110;inset:50% auto auto 50%;display:grid;justify-items:center;gap:.75rem;width:min(88vw,520px);padding:2rem;background:radial-gradient(circle at 50% 15%,rgba(200,163,90,.16),transparent 50%),rgba(5,6,7,.98);border:1px solid var(--gold);box-shadow:0 0 0 100vmax rgba(0,0,0,.82),0 24px 90px #000;transform:translate(-50%,-50%);text-align:center;animation:outcomeReveal .5s ease-out both}
.game-outcome>span{color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font-size:.7rem}
.game-outcome>strong{color:var(--pale);font-size:clamp(2.6rem,9vw,5.5rem);line-height:.9;letter-spacing:.08em}
.game-outcome.lose>strong{color:#b8b2aa}.game-outcome.draw>strong{color:var(--gold)}
.game-outcome p{margin:0 0 .4rem;color:var(--muted)}
@keyframes blackwingReveal{from{opacity:0;transform:translate(-50%,-46%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes blackwingArrival{0%,100%{box-shadow:inset 0 0 0 0 transparent}35%{box-shadow:inset 0 0 0 3px var(--gold),inset 0 0 40px rgba(200,163,90,.28)}}
@keyframes outcomeReveal{from{opacity:0;transform:translate(-50%,-45%) scale(.88)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:650px){.hand{min-height:285px}.hand-card{flex-basis:155px}.mini{width:58px}}
