@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&family=Lato:wght@300;400;700&display=swap");:root{--cream:#fdf6ec;--parchment:#f5e6d0;--warm-tan:#e8d0b0;--terracotta:#c17b5c;--terra-light:#d9917a;--terra-dark:#a05f42;--amber:#e8a44a;--amber-light:#f5c87a;--sage:#8aab8a;--sage-light:#b0c9b0;--rust:#b85c3a;--bark:#7a4f3a;--ink:#3d2b1f;--muted:#8a7060;--shadow:rgba(90,55,30,.15)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--cream);background-image:radial-gradient(ellipse at 20% 20%,rgba(232,164,74,.08) 0,transparent 60%),radial-gradient(ellipse at 80% 80%,rgba(193,123,92,.08) 0,transparent 60%);font-family:Lato,sans-serif;color:var(--ink);min-height:100vh}.game-wrapper{max-width:1100px;margin:0 auto;padding:32px 20px 60px;display:flex;flex-direction:column;align-items:center;gap:0}.game-header{text-align:center;margin-bottom:28px}.game-title{font-family:Playfair Display,serif;font-size:3.4rem;font-weight:800;color:var(--terra-dark);letter-spacing:-.5px;line-height:1.1}.game-title span{color:var(--amber);position:relative}.game-subtitle{font-size:1rem;color:var(--muted);font-weight:300;letter-spacing:.5px;margin-top:6px}.game-tagline{font-size:.95rem;color:var(--bark);margin-top:8px;max-width:460px;margin-left:auto;margin-right:auto;line-height:1.6}.game-tagline strong{font-weight:700;color:var(--terracotta)}.btn-restart{margin-top:16px;background:var(--terracotta);color:#fff;border:none;padding:10px 28px;border-radius:50px;font-family:Lato,sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:background .2s,transform .1s,box-shadow .2s;box-shadow:0 4px 14px rgba(161,95,66,.35)}.btn-restart:hover{background:var(--terra-dark);box-shadow:0 6px 18px rgba(161,95,66,.45);transform:translateY(-1px)}.btn-restart:active{transform:translateY(0)}.winner-banner{margin:16px 0 8px;padding:14px 28px;border-radius:12px;font-family:Playfair Display,serif;font-size:1.3rem;font-weight:700;text-align:center;animation:pop-in .4s cubic-bezier(.175,.885,.32,1.275)}@keyframes pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.winner-banner.user{background:linear-gradient(135deg,#f0e6d2,#e8d4b4);color:#5a8a5a;border:2px solid var(--sage);box-shadow:0 4px 20px rgba(138,171,138,.25)}.winner-banner.opponent{background:linear-gradient(135deg,#f5ddd5,#f0c9b8);color:var(--rust);border:2px solid var(--terra-light);box-shadow:0 4px 20px rgba(193,123,92,.25)}.winner-banner.tie{background:linear-gradient(135deg,#fdf0d8,#f8e2b8);color:var(--bark);border:2px solid var(--amber);box-shadow:0 4px 20px rgba(232,164,74,.25)}.scoreboard{justify-content:space-between;width:100%;max-width:820px;background:var(--parchment);border:1.5px solid var(--warm-tan);border-radius:16px;padding:14px 28px;margin:16px 0;box-shadow:0 2px 12px var(--shadow)}.score-block,.scoreboard{display:flex;align-items:center}.score-block{flex-direction:column;gap:2px}.score-label{font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.score-number{font-size:1.5rem;font-weight:800;line-height:1;color:var(--terracotta)}.score-vs{font-family:Playfair Display,serif;font-size:1.1rem;color:var(--warm-tan);font-weight:600}.boards-container{display:flex;flex-direction:row;gap:28px;width:100%;max-width:820px;justify-content:center}@media (max-width:660px){.boards-container{flex-direction:column;align-items:center}.board-panel{width:100%;max-width:340px}}.board-panel{flex:1;display:flex;flex-direction:column;align-items:center;background:var(--parchment);border:1.5px solid var(--warm-tan);border-radius:20px;padding:20px 16px;box-shadow:0 4px 18px var(--shadow)}.board-panel-title{font-family:Playfair Display,serif;font-size:1.25rem;font-weight:700;margin-bottom:14px;color:var(--terracotta);text-align:center;width:-webkit-fill-available}.board-panel-title.opponent{color:var(--bark)}.board-panel-title-text{float:left}.score-pill{font-size:.92rem;float:right}.score-pill.opponent{color:var(--bark)}.bingo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;width:100%}.bingo-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:1.05rem;font-weight:700;color:var(--ink);background:var(--cream);border:1.5px solid var(--warm-tan);transition:all .18s ease;cursor:default;user-select:none;box-shadow:0 1px 4px rgba(90,55,30,.08)}.bingo-cell.clickable{cursor:pointer}.bingo-cell.clickable:hover{background:#fdecd8;border-color:var(--terracotta);transform:scale(1.07);box-shadow:0 4px 12px rgba(193,123,92,.25)}.bingo-cell.clickable:active{transform:scale(.97)}.bingo-cell.selected{background:linear-gradient(135deg,#f0c99a,#e8a44a);border-color:var(--amber);color:var(--bark);box-shadow:0 2px 8px rgba(232,164,74,.35)}.bingo-cell.completed{background:linear-gradient(135deg,#b8d4b8,#8aab8a);border-color:var(--sage);color:#fff;box-shadow:0 2px 8px rgba(138,171,138,.4)}.bingo-cell.recent{background:linear-gradient(135deg,#f5b89a,#c17b5c);border-color:var(--rust);color:#fff;animation:pulse-cell .5s ease;box-shadow:0 3px 12px rgba(184,92,58,.4)}@keyframes pulse-cell{0%{transform:scale(1.2)}60%{transform:scale(.95)}to{transform:scale(1)}}.turn-indicator{margin-top:4px;margin-bottom:14px;padding:10px 22px;border-radius:50px;font-size:.9rem;font-weight:700;letter-spacing:.3px;text-align:center;transition:all .3s ease}.turn-indicator.user-turn{background:linear-gradient(135deg,#e8f4e8,#d4ebd4);color:#4a7a4a;border:1.5px solid var(--sage);box-shadow:0 2px 10px rgba(138,171,138,.2)}.turn-indicator.opp-turn{background:linear-gradient(135deg,#f5ede5,#edc);color:var(--terracotta);border:1.5px solid var(--terra-light);box-shadow:0 2px 10px rgba(193,123,92,.15);animation:thinking-pulse 1.4s ease-in-out infinite}@keyframes thinking-pulse{0%,to{opacity:1}50%{opacity:.65}}.how-to-play{margin-top:32px;width:100%;max-width:820px;background:var(--parchment);border:1.5px solid var(--warm-tan);border-radius:20px;padding:24px 28px;box-shadow:0 2px 12px var(--shadow)}.how-to-play h2{font-family:Playfair Display,serif;font-size:1.2rem;font-weight:700;color:var(--terracotta);margin-bottom:14px;letter-spacing:.2px}.how-to-play ol{list-style:none;counter-reset:step-counter;display:flex;flex-direction:column;gap:8px}.how-to-play ol li{counter-increment:step-counter;display:flex;align-items:flex-start;gap:12px;color:var(--bark);font-size:.92rem;line-height:1.55}.how-to-play ol li:before{content:counter(step-counter);background:var(--terracotta);color:#fff;font-weight:700;font-size:.78rem;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}.how-to-play p{color:var(--bark);font-size:.92rem;line-height:1.55}.how-to-play a{color:var(--terracotta);font-weight:700;text-decoration:underline;text-underline-offset:2px;transition:color .15s}.how-to-play a:hover{color:var(--rust)}.legend{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:12px}.legend-item{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted)}.legend-dot{width:14px;height:14px;border-radius:4px}.share-panel{background:linear-gradient(135deg,#fdf6ec,#f5e6d0);border:1.5px solid var(--warm-tan);border-radius:20px;padding:1.5rem;margin:8px auto 16px;width:100%;max-width:640px;display:flex;flex-direction:column;gap:14px;box-shadow:0 4px 18px var(--shadow);animation:shareSlideIn .4s cubic-bezier(.16,1,.3,1) both}@keyframes shareSlideIn{0%{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.share-card-preview{background:var(--cream);border:1.5px solid var(--warm-tan);border-radius:14px;padding:1.25rem 1rem;text-align:center;box-shadow:0 2px 8px var(--shadow)}.share-trophy{font-size:30px;margin-bottom:6px}.share-headline{font-family:Playfair Display,serif;font-size:1.3rem;font-weight:700;color:var(--terra-dark);margin:0 0 4px}.share-sub{font-size:.85rem;color:var(--muted);margin:0 0 14px;font-weight:400}.share-score-row{display:flex;align-items:center;justify-content:center;gap:14px}.share-score-chip{border-radius:12px;padding:7px 22px;display:flex;flex-direction:column;align-items:center;min-width:68px}.user-chip{background:linear-gradient(135deg,#f0e6d2,#e8d4b4)}.opp-chip,.user-chip{border:1.5px solid var(--warm-tan)}.opp-chip{background:var(--parchment)}.chip-label{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}.chip-val{font-family:Playfair Display,serif;font-size:1.6rem;font-weight:700;color:var(--terracotta);line-height:1.2}.opp-chip .chip-val{color:var(--muted)}.share-vs{font-family:Playfair Display,serif;font-size:1rem;color:var(--warm-tan);font-weight:600}.share-section-label{font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-top:16px}.share-text-preview{background:var(--cream);border:1.5px solid var(--warm-tan);border-radius:12px;padding:12px 16px;font-size:.88rem;color:var(--bark);line-height:1.65;white-space:pre-line;font-family:Lato,sans-serif}.share-btn-row{display:flex;gap:6px;flex-wrap:wrap}.share-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:48px;font-family:Lato,sans-serif;font-size:.85rem;font-weight:700;letter-spacing:.3px;cursor:pointer;transition:transform .1s,box-shadow .2s,background .2s;border:none}.share-btn:hover{transform:translateY(-1px)}.share-btn:active{transform:scale(.97)}.copy-btn{background:var(--parchment);color:var(--bark);border:1.5px solid var(--warm-tan);box-shadow:0 2px 8px var(--shadow)}.copy-btn:hover{background:var(--warm-tan);box-shadow:0 4px 12px var(--shadow)}.twitter-btn{background:var(--ink);color:#fff;box-shadow:0 2px 8px rgba(61,43,31,.3)}.twitter-btn:hover{background:#1a0e08;box-shadow:0 4px 14px rgba(61,43,31,.4)}.whatsapp-btn{background:#25d366;color:#fff;box-shadow:0 2px 8px rgba(37,211,102,.3)}.whatsapp-btn:hover{background:#1db954;box-shadow:0 4px 14px rgba(37,211,102,.4)}.share-tip{font-size:.78rem;color:var(--muted);margin:0;text-align:center;font-style:italic}.share-tip a{color:var(--terracotta);font-weight:700;text-decoration:underline;text-underline-offset:2px;font-style:normal;transition:color .15s}.share-tip a:hover{color:var(--rust)}.banner-heading{font-family:Playfair Display,serif;font-size:1.2rem;font-weight:700;margin-bottom:4px}.banner-sub{font-size:.88rem;font-weight:400;opacity:.85}