@import"https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Lora:wght@400;500;600;700&display=swap";.navbar{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;margin-bottom:24px;border-bottom:1px solid rgba(249,92,75,.2);flex-shrink:0;position:relative}.navbar-brand{font-family:Space Mono,monospace;color:var(--text-light);font-size:18pt;font-weight:700;text-decoration:none;transition:color .2s ease;letter-spacing:-.02em}.navbar-brand:hover{color:var(--coral)}.nav-links{display:flex;list-style:none;gap:32px;align-items:center;margin:0;padding:0}.nav-link{font-family:Lora,serif;font-weight:500;font-size:11pt;color:var(--text-light);text-decoration:none;transition:color .2s ease;letter-spacing:.02em;text-transform:uppercase}.nav-link:hover{color:var(--coral)}.nav-link.active{color:var(--coral);border-bottom:2px solid var(--coral);padding-bottom:2px}.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:8px;transition:transform .2s ease}.hamburger:active{transform:scale(.95)}.hamburger-line{display:block;width:24px;height:1.5px;background-color:var(--text-light);border-radius:1px;transition:transform .25s ease,opacity .25s ease}.hamburger.open .hamburger-line:nth-child(1){transform:translateY(7px) rotate(45deg)}.hamburger.open .hamburger-line:nth-child(2){opacity:0}.hamburger.open .hamburger-line:nth-child(3){transform:translateY(-7px) rotate(-45deg)}@media(max-width:768px){.navbar{padding-bottom:12px;margin-bottom:16px}.hamburger{display:flex}.nav-links{display:none;position:absolute;top:calc(100% + 8px);left:-24px;right:-24px;flex-direction:column;gap:0;background-color:#000000f2;border:1px solid rgba(249,92,75,.2);border-top:none;border-radius:0 0 6px 6px;padding:8px 24px 12px;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.nav-links.open{display:flex}.nav-links li{width:100%;border-bottom:1px solid rgba(249,92,75,.1)}.nav-links li:last-child{border-bottom:none}.nav-link{display:block;padding:12px 0;font-size:12pt}.navbar-brand{font-size:16pt}}@media(max-width:480px){.nav-links{left:-16px;right:-16px;padding:8px 16px 12px}.navbar-brand{font-size:14pt}.hamburger{padding:6px}.hamburger-line{width:20px}}.theme-toggle{background:none;border:none;cursor:pointer;font-size:16pt;color:var(--text-light);padding:4px 8px;line-height:1;transition:opacity .2s ease,transform .2s ease;display:flex;align-items:center}.theme-toggle:hover{opacity:.7;transform:scale(1.1)}.theme-toggle-item{display:flex;align-items:center;border-bottom:none!important}@media(max-width:768px){.theme-toggle{padding:12px 0;font-size:14pt}}:root[data-theme=light] .nav-links{background-color:#f5f1e8fa;border-color:#f95c4b33}:root[data-theme=light] .nav-links li{border-bottom-color:#f95c4b1a}:root{--black: #000000;--coral: #F95C4B;--stone: #E4DED2;--paper: #F6F4F1;--bg-base: #000000;--accent-primary: #F95C4B;--text-light: #F6F4F1;--text-secondary: #E4DED2}:root[data-theme=light]{--bg-base: #F5F1E8;--black: #FFFFFF;--paper: #1C1A17;--stone: #7A746C;--text-light: #1C1A17;--text-secondary: #7A746C}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%}body{background-color:var(--bg-base);display:flex;align-items:center;justify-content:center;height:100vh;overflow:hidden;font-family:Lora,serif;font-weight:400;color:var(--text-light)}.fabric{background-color:var(--bg-base);display:flex;flex-direction:column;border-radius:0;height:100vh;width:100vw;padding:40px;position:relative}.page-content{flex:1;overflow-y:auto;min-height:0}h1{font-family:Space Mono,monospace;font-size:48pt;font-weight:700;color:var(--text-light);letter-spacing:-.02em}h2{font-family:Space Mono,monospace;font-size:28pt;font-weight:700;color:var(--text-light);letter-spacing:-.02em;margin-bottom:24px;text-align:center}h4{font-family:Space Mono,monospace;font-size:12pt;font-weight:700;color:var(--text-light);letter-spacing:.05em;text-transform:uppercase}hr{border:none;border-top:1px solid rgba(249,92,75,.3);margin:16px 0;width:100%}.menu-buttons{display:flex;flex-direction:column;align-items:flex-start;gap:20px}.menu-buttons button{border:none;color:var(--text-light);background-color:transparent;font-family:Lora,serif;font-weight:500;font-size:20pt;font-style:normal;text-align:left;cursor:pointer;padding:0;transition:color .2s ease,transform .2s ease;letter-spacing:-.01em}.menu-buttons button:hover{color:var(--accent-primary);transform:translate(6px)}.menu-buttons button:active{transform:translate(4px)}@media(max-width:768px){.fabric{padding:24px;height:100vh;width:100vw}h1{font-size:32pt}h2{font-size:24pt;margin-bottom:16px}.menu-buttons button{font-size:18pt}}@media(max-width:480px){.fabric{padding:16px}h1{font-size:28pt}h2{font-size:20pt}.menu-buttons{gap:16px}.menu-buttons button{font-size:16pt}}@media screen and (orientation:landscape)and (max-height:500px){.fabric{padding:16px 40px}h2{font-size:20pt;margin-bottom:12px}.page-content{display:flex;flex-direction:column;overflow-y:hidden}}.scoreboards-display{display:flex;justify-content:center;align-items:center;gap:32px;height:100%}.Score{color:var(--coral);font-size:64px;font-weight:700;font-family:Space Mono,monospace;text-align:center;padding:20px 0;letter-spacing:-.03em}.game-grid-buttons{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}.game-button{background-color:transparent;color:var(--paper);padding:16px 20px;width:100%;text-align:center;border:1.5px solid rgba(249,92,75,.3);border-radius:6px;font-family:Space Mono,monospace;font-size:13pt;font-weight:700;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.game-button:hover{border-color:var(--coral);color:var(--coral);background-color:#f95c4b14}.game-button:active{background-color:#f95c4b26;transform:scale(.98)}.game-grid-buttons .game-button:nth-last-child(-n+2){background-color:transparent;border-color:#e4ded233;color:var(--stone)}.game-grid-buttons .game-button:nth-last-child(-n+2):hover{border-color:var(--stone);background-color:#e4ded21a;color:var(--paper)}.circle{width:12px;height:12px;background-color:transparent;border:2px solid rgba(249,92,75,.3);border-radius:50%;transition:all .2s ease}.circle.active{background-color:var(--coral);border-color:var(--coral);box-shadow:0 0 12px #f95c4b66}.wins-indicator{justify-content:center;align-items:center;width:100%;display:flex;gap:12px;margin:16px 0}h2{display:flex;justify-content:center;align-items:center;font-family:Space Mono,monospace;font-weight:700;font-size:26pt;color:var(--text-light);letter-spacing:-.02em;margin-bottom:32px}textarea{background-color:transparent;border:1px solid rgba(246,244,241,.2);border-radius:4px;text-align:center;align-content:center;padding:12px 8px;resize:none;outline:1px solid transparent;transition:all .2s ease;font-family:Lora,serif;font-weight:600;color:var(--text-light);font-size:14pt;width:100%}textarea:focus{outline:1px solid var(--coral);border-color:var(--coral);background-color:#f95c4b0d}textarea::selection{background-color:var(--coral);color:var(--black)}.scoreboard{background-color:transparent;padding:32px 28px;border:1px solid rgba(246,244,241,.1);border-radius:8px;box-shadow:none}.centered-div-scoreboard{display:flex;align-items:center;justify-content:center;flex-direction:column}.dialog-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dialog-box{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;background-color:var(--black);border:1px solid rgba(249,92,75,.3);color:var(--text-light);max-width:320px;border-radius:8px;z-index:1001}.dialog-box h3{font-family:Space Mono,monospace;font-size:20pt;font-weight:700;margin-bottom:12px;letter-spacing:-.02em}.dialog-box p{font-family:Lora,serif;font-size:14pt;text-align:center;margin-bottom:24px}.dialog-box button{background-color:var(--coral);color:var(--black);border:none;padding:12px 40px;border-radius:6px;font-family:Space Mono,monospace;font-weight:700;font-size:12pt;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.05em}.dialog-box button:hover{background-color:var(--stone);transform:translateY(-2px)}.dialog-box button:active{transform:translateY(0)}@media screen and (min-width:769px){.scoreboard{padding:36px 32px;min-width:500px}.Score{font-size:72pt;padding:24px 0}textarea{font-size:15pt;padding:14px 10px}.game-button{padding:18px 24px;font-size:14pt}.game-grid-buttons{gap:14px}.wins-indicator{margin:16px 0}}@media screen and (max-width:768px){h2{font-size:22pt;margin-bottom:20px}.scoreboards-display{gap:16px;padding:0}.scoreboard{padding:20px 16px}textarea{font-size:13pt;padding:8px 4px}.Score{font-size:44pt;padding:12px 0}.game-grid-buttons{gap:10px}.game-button{padding:14px 12px;font-size:12pt}.circle{width:10px;height:10px}.wins-indicator{gap:10px;margin:12px 0}}@media screen and (max-width:480px){h2{font-size:18pt;margin-bottom:16px}.scoreboards-display{gap:12px;padding:0}.scoreboard{padding:16px 12px}textarea{font-size:12pt;padding:6px 4px}.Score{font-size:40pt;padding:10px 0}.game-grid-buttons{gap:8px}.game-button{padding:12px 10px;font-size:11pt}.circle{width:9px;height:9px}.wins-indicator{gap:8px;margin:10px 0}}:root[data-theme=light] textarea{border-color:#1c1a1733;color:var(--text-light)}:root[data-theme=light] textarea:focus{background-color:#f95c4b0d}:root[data-theme=light] .scoreboard{border-color:#1c1a171f}:root[data-theme=light] .game-button{color:var(--paper)}:root[data-theme=light] .game-grid-buttons .game-button:nth-last-child(-n+2){border-color:#1c1a1733;color:var(--stone)}:root[data-theme=light] .game-grid-buttons .game-button:nth-last-child(-n+2):hover{border-color:var(--stone);background-color:#1c1a170f;color:var(--paper)}:root[data-theme=light] .dialog-box{border-color:#f95c4b40;box-shadow:0 8px 32px #00000026}@media screen and (orientation:landscape)and (max-height:500px){h2{display:none}.scoreboards-display{flex:1;min-height:0;gap:12px;align-items:stretch}.centered-div-scoreboard{flex:1;min-height:0;align-items:stretch;justify-content:flex-start;flex-direction:column}.scoreboard{flex:1;min-height:0;padding:12px 14px;display:flex;flex-direction:column;justify-content:space-between}.Score{font-size:32pt;padding:4px 0}textarea{font-size:12pt;padding:4px}.game-button{padding:10px 8px;font-size:11pt}.game-grid-buttons{gap:6px}.wins-indicator{margin:4px 0;gap:6px}}.how-to-play{padding-bottom:48px}.how-to-play h2{margin-bottom:32px}.how-to-play p,.how-to-play li{color:var(--text-light);font-family:Lora,serif;font-size:13pt;font-weight:400;line-height:1.7}.how-to-play p{margin-bottom:16px}.how-to-play ul,.how-to-play ol{margin:8px 0 18px 28px;padding:0}.how-to-play li{margin-bottom:8px}h4{font-family:Space Mono,monospace;font-size:11pt;font-weight:700;color:var(--text-light);letter-spacing:.05em;text-transform:uppercase;margin-bottom:12px}hr{border:none;border-top:1px solid rgba(249,92,75,.25);margin:16px 0 20px;width:100%}.variant-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0 24px}.variant-card{background:#f95c4b0d;border:1px solid rgba(249,92,75,.15);border-radius:6px;padding:18px;border-left:3px solid var(--coral)}.variant-title{color:var(--coral);font-family:Space Mono,monospace;font-size:10pt;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}.variant-card ol,.variant-card ul{margin-left:24px}.variant-card li{color:var(--text-light);font-family:Lora,serif;font-size:12pt;margin-bottom:6px}.variant-card p{color:var(--text-light);font-family:Lora,serif;font-size:12pt;line-height:1.6}.truco-scale{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:18px 0 20px}.scale-step{font-family:Space Mono,monospace;font-size:11pt;font-weight:700;color:var(--text-light);background:#f6f4f114;border:1px solid rgba(246,244,241,.15);padding:6px 14px;border-radius:4px;letter-spacing:.02em}.scale-arrow{color:var(--coral);font-size:12pt;font-weight:700}.htp-note{font-size:12pt!important;opacity:.8;font-style:italic;color:var(--stone);margin-top:16px}.htp-example{font-style:italic;opacity:.85;font-size:12pt!important;margin-top:10px;color:var(--stone)}@media(max-width:768px){.variant-grid{grid-template-columns:1fr;gap:12px;margin:12px 0 18px}.how-to-play p,.how-to-play li{font-size:12pt;line-height:1.6}.variant-card{padding:14px}.scale-step{font-size:10pt;padding:5px 12px}h4{font-size:10pt;margin-bottom:10px}}:root[data-theme=light] .scale-step{background:#1c1a170f;border-color:#1c1a1726}:root[data-theme=light] .variant-card{background:#f95c4b0a}@media(max-width:480px){.how-to-play{padding-bottom:32px}.how-to-play p,.how-to-play li{font-size:11pt}.how-to-play ul,.how-to-play ol{margin:6px 0 14px 24px}.variant-grid{gap:10px}.variant-card{padding:12px;border-left-width:2px}.truco-scale{gap:6px;margin:14px 0 16px}.scale-step{font-size:9pt;padding:4px 10px}}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{box-shadow:0 0 #f95c4b66}50%{box-shadow:0 0 0 6px #f95c4b00}}.card{width:56px;height:88px;padding:6px;background:#000;border:1.5px solid var(--coral);border-radius:4px;box-shadow:0 4px 12px #00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Space Mono,monospace;font-size:1.3rem;font-weight:700;margin:0 2px;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;animation:fadeIn .4s ease-out}.card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #f95c4b4d}.card:active{transform:translateY(-2px);box-shadow:0 4px 10px #f95c4b33}.card.selected{border:2px solid var(--coral);background:#f95c4b14;box-shadow:0 0 16px #f95c4b66;animation:pulse 2s infinite}.card.selected .card-value,.card.highlight .card-value{color:var(--coral)}.card.highlight{border:2px solid var(--coral);background:linear-gradient(135deg,#f95c4b26,#f95c4b8c);animation:fadeIn .4s ease-out}.card-value{font-weight:700;font-size:1.2em;color:var(--paper);line-height:1}.card-suit{font-size:1.4em;margin-top:3px}.card-suit-hearts,.card-suit-diamonds{color:var(--coral)}.card-suit-clubs,.card-suit-spades{color:var(--paper)}:root[data-theme=light] .card{background:linear-gradient(135deg,#f6f4f1f2,#e4ded2e6);border:1.5px solid rgba(246,244,241,.3);box-shadow:0 4px 12px #0000004d}:root[data-theme=light] .card:hover{box-shadow:0 8px 16px #0006;border-color:var(--coral)}:root[data-theme=light] .card:active{box-shadow:0 4px 8px #0000004d}:root[data-theme=light] .card.selected{background:#f6f4f1;box-shadow:0 0 16px #f95c4b4d}:root[data-theme=light] .card.highlight{background:linear-gradient(135deg,#f95c4b26,#f95c4bcc)}:root[data-theme=light] .card-value{color:#222}:root[data-theme=light] .card-suit-clubs,:root[data-theme=light] .card-suit-spades{color:#222}@media(max-width:768px){.card{width:50px;height:80px;padding:5px;font-size:1.1rem}.card-value{font-size:1rem}.card-suit{font-size:1.2em;margin-top:2px}}@media(max-width:480px){.card{width:44px;height:70px;padding:4px;font-size:1rem;border-radius:3px;margin:0 1px}.card-value{font-size:.9em}.card-suit{font-size:1rem;margin-top:1px}.card:hover{transform:translateY(-2px)}}:root{--black: #000000;--coral: #F95C4B;--stone: #E4DED2;--paper: #F6F4F1}.oc-section{background-color:transparent;border:1px solid rgba(246,244,241,.1);padding:24px;border-radius:6px;box-shadow:none;margin-bottom:20px}.oc-section h4{color:var(--text-light);font-size:12pt;letter-spacing:.06em;text-transform:uppercase;font-family:Space Mono,monospace;font-weight:700}.oc-section .card{border-color:var(--coral)}.oc-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.oc-hint{font-family:Lora,serif;font-size:11pt;font-weight:400;color:var(--stone);text-align:center;margin-bottom:16px;letter-spacing:.02em}.card-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}.reset-button{background-color:transparent;color:var(--coral);border:1px solid rgba(249,92,75,.4);border-radius:4px;padding:6px 16px;font-family:Space Mono,monospace;font-size:10pt;font-weight:700;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.04em}.reset-button:hover{background-color:#f95c4b1a;border-color:var(--coral)}.reset-button:active{transform:scale(.96)}@media(max-width:768px){.oc-section{padding:16px;margin-bottom:16px}.card-row{gap:6px}.oc-hint{font-size:10pt;margin-bottom:12px}}@media(max-width:480px){.oc-section{padding:12px;margin-bottom:14px}.card-row{gap:4px}.reset-button{padding:5px 12px;font-size:9pt}}
