:root { color-scheme: dark; --felt:#0a563d; --felt-dark:#063b2b; --cream:#f1e5c8; --gold:#d9a441; --ink:#191713; --red:#a8312b; }
* { box-sizing: border-box; }
body { margin:0; background:#12110f; color:var(--cream); font-family:Georgia, 'Times New Roman', serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.13; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E"); }
.site-header, main, footer { width:min(1180px, calc(100% - 40px)); margin:auto; }
.site-header { display:flex; justify-content:space-between; align-items:end; padding:56px 0 30px; border-bottom:1px solid #4f493d; }
.eyebrow,.section-number { color:var(--gold); font:700 11px/1.2 Arial,sans-serif; letter-spacing:.2em; }
.back-link { display:inline-block; margin-bottom:14px; color:#8a8275; font:700 11px Arial,sans-serif; letter-spacing:.1em; text-decoration:none; }
.back-link:hover { color:var(--gold); }
h1 { margin:8px 0 6px; font-size:clamp(40px,7vw,88px); font-weight:400; line-height:.9; letter-spacing:-.04em; }
.dek { margin:14px 0 0; color:#aaa18f; font-style:italic; }
.year-badge { border:1px solid var(--gold); color:var(--gold); border-radius:50%; width:88px; height:88px; display:grid; place-items:center; transform:rotate(7deg); font:700 12px Arial,sans-serif; }
.game-shell { padding:38px 0; }
.table { position:relative; overflow:hidden; min-height:640px; padding:42px clamp(20px,5vw,70px) 42px; border:5px solid #ddd; border-radius:0; background:#006600; box-shadow:0 25px 70px #0009; image-rendering:pixelated; }
.table-rim { position:absolute; inset:6px; border:1px solid #98d18e; border-radius:0; pointer-events:none; }
.table-heading { text-align:center; color:#d6ff42; display:grid; justify-items:center; gap:3px; font:400 12px 'Courier New',monospace; letter-spacing:0; }
.hand-area { min-height:145px; position:relative; z-index:1; }
.hand-label { display:flex; justify-content:center; gap:12px; color:#f2db9d; font:700 12px Arial,sans-serif; text-transform:uppercase; letter-spacing:.14em; margin:22px 0 12px; }
.cards { min-height:104px; display:flex; justify-content:center; align-items:center; gap:clamp(5px,1vw,12px); }
.player-area { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; gap:8px 28px; }
.hand-group { padding:6px 12px; border-radius:8px; transition:box-shadow .2s; }
.hand-group.active { box-shadow:0 0 0 2px var(--gold) inset; }
.hand-group .hand-label { margin:16px 0 10px; }
.card { width:70px; height:auto; flex:0 0 auto; border:0; border-radius:0; box-shadow:3px 4px 0 #003900; image-rendering:pixelated; animation:deal .22s ease-out both; }
@keyframes deal { from { transform:translate(120px,-30px) rotate(10deg); opacity:0 } }
.message { width:fit-content; max-width:90%; margin:7px auto; padding:8px 18px; text-align:center; color:#ffff33; background:#006600; border-block:1px solid #ffff33; font:700 22px 'Comic Sans MS','Chalkboard SE',cursive; }
.controls { position:relative; z-index:2; margin-top:28px; }
.money-panel { max-width:700px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:14px 18px; background:#071d17cc; border:1px solid #d7b15c77; font:12px Arial,sans-serif; text-transform:uppercase; letter-spacing:.1em; }
.money-panel div,.money-panel label { display:flex; gap:7px; flex-direction:column; align-items:center; }
.money-panel strong { font:700 20px Georgia,serif; color:var(--gold); }
input { width:92px; padding:4px; color:var(--cream); background:#0005; border:1px solid #9a844e; font:bold 18px Georgia,serif; text-align:center; }
.button-row { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin-top:18px; }
button { min-width:90px; padding:11px 17px; border:1px solid #ffdc7d; background:linear-gradient(#e8bc55,#b7781d); color:#211609; font:700 12px Arial,sans-serif; letter-spacing:.09em; text-transform:uppercase; cursor:pointer; box-shadow:0 3px 0 #5e340d; }
button:hover:not(:disabled) { filter:brightness(1.12); transform:translateY(-1px); }
button:disabled { opacity:.38; cursor:not-allowed; }
button.secondary { background:#183a31; color:var(--cream); border-color:#7c8c82; box-shadow:0 3px 0 #061713; }
.story-grid { display:grid; grid-template-columns:1fr 1fr .8fr; gap:36px; padding:52px 0 72px; border-top:1px solid #4f493d; }
h2 { font-weight:400; font-size:28px; line-height:1.08; }
.story-grid p,.story-grid li { color:#bdb4a3; line-height:1.65; }
.story-grid ul { padding-left:18px; }
.archive-card { padding:24px; background:#e8ddc2; color:var(--ink); transform:rotate(1deg); box-shadow:8px 10px 0 #0004; }
.archive-card p { color:#4f493f; }
.archive-card a { color:#7c281e; font-weight:bold; }
footer { padding:24px 0 46px; border-top:1px solid #4f493d; display:flex; justify-content:space-between; color:#7f786b; font:11px Arial,sans-serif; text-transform:uppercase; letter-spacing:.1em; }
@media(max-width:760px){ .site-header{align-items:start}.year-badge{width:66px;height:66px}.table{min-height:620px;border-width:4px;padding-inline:14px}.card{width:55px}.money-panel{grid-template-columns:1fr 1fr}.money-panel div:last-child{display:none}.story-grid{grid-template-columns:1fr}.button-row button{min-width:calc(33% - 9px)}footer{display:block} }
