*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--bg: #f5ede2;--surface: #ebe4d8;--surface2: #e0d8ca;--border: #c9bfad;--border-soft: #d4cbbd;--p1: #8b6914;--p1-dim: #e8dfc9;--p2: #8b4513;--p2-dim: #ede4dc;--accent: #b8860b;--gold: #c4a035;--red-soft: #9c5344;--green: #5a7d5a;--text: #3d3630;--muted: #6b5d52;--error: #9c5344;--jarnac: #b8860b;--radius: 12px;--radius-sm: 8px;--shadow-soft: 0 2px 12px rgba(61, 54, 48, .06);--shadow-gold: 0 2px 16px rgba(184, 134, 11, .15)}html,body,#root{height:100%;overflow:hidden}body{font-family:Lora,Georgia,serif;background:var(--bg);color:var(--text)}.app{height:100%;display:flex;flex-direction:column;max-width:100%;margin:0 auto;position:relative}.menu{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;padding:24px;overflow:hidden}.logo{text-align:center}.logo-icon{font-size:64px;display:block;margin-bottom:12px;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.logo h1{font-size:48px;font-weight:700;letter-spacing:6px;color:var(--text);text-shadow:0 1px 2px rgba(61,54,48,.08)}.subtitle{color:var(--muted);font-size:15px;margin-top:8px;letter-spacing:3px;text-transform:uppercase;font-weight:500}.menu-buttons{display:flex;flex-direction:column;gap:16px;width:100%;max-width:300px}.menu-difficulty-title{font-size:1rem;font-weight:600;color:var(--muted);margin-bottom:4px;text-align:center}.menu-back-btn{margin-top:8px}.menu-rules{width:100%;max-width:420px;flex-shrink:1;min-height:0;display:flex;flex-direction:column}.rules-details{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-height:0;box-shadow:var(--shadow-soft)}.rules-details summary{flex-shrink:0;padding:14px 18px;font-weight:600;font-size:15px;color:var(--gold);cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}.rules-details summary::-webkit-details-marker{display:none}.rules-details summary:before{content:"▶ ";font-size:10px;margin-right:8px;opacity:.8}.rules-details[open] summary:before{content:"▼ "}.rules-content{padding:0 18px 18px;color:var(--muted);font-size:14px;line-height:1.7;max-height:0;overflow:hidden;transition:max-height .2s ease-out}.rules-details[open] .rules-content{max-height:min(45vh,320px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.rules-content p{margin-bottom:12px}.rules-content p:last-child{margin-bottom:0}.rules-content strong{color:var(--text)}.rules-tip{margin-top:8px;color:var(--gold);font-weight:600;font-size:13px}.rules-mini{text-align:center;color:var(--muted);font-size:13px;line-height:1.6}.scoring{color:var(--gold);font-weight:600;font-size:15px;margin-top:8px}.btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;border:none;border-radius:var(--radius);font-family:inherit;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;white-space:nowrap}.btn:active{transform:scale(.96)}.btn-primary{background:linear-gradient(180deg,#c9b896 0%,var(--p1) 100%);color:#2a251e;border:1px solid rgba(139,105,20,.3);box-shadow:var(--shadow-soft)}.btn-primary:hover{box-shadow:var(--shadow-gold);border-color:var(--accent)}.btn-secondary{background:linear-gradient(180deg,#d4b8a8 0%,var(--red-soft) 100%);color:#f8f4ef;border:1px solid rgba(156,83,68,.3);box-shadow:var(--shadow-soft)}.btn-secondary:hover{box-shadow:0 2px 16px #9c534433;border-color:var(--red-soft)}.btn-outline{background:transparent;color:var(--muted);border:1px solid var(--border)}.btn-outline:hover{border-color:var(--muted);color:var(--text)}.btn-ghost{background:transparent;color:var(--muted);font-size:14px;padding:8px 16px}.btn-ghost:hover{color:var(--text)}.btn-jarnac{background:linear-gradient(180deg,#d4c078 0%,var(--jarnac) 100%);color:#2a251e;border:1px solid rgba(184,134,11,.4);box-shadow:var(--shadow-gold);animation:pulse-jarnac 1.5s ease-in-out infinite}@keyframes pulse-jarnac{0%,to{box-shadow:var(--shadow-gold)}50%{box-shadow:0 2px 20px #b8860b40}}.btn-large{padding:18px 32px;font-size:18px;width:100%}.btn-icon{font-size:20px}.btn:disabled{opacity:.4;pointer-events:none}.btn-difficulty-easy{background:linear-gradient(180deg,#d4e0d0 0%,var(--green) 100%);color:#1a2518;border:1px solid rgba(90,125,90,.35)}.btn-difficulty-medium{background:linear-gradient(180deg,#d4c078 0%,var(--gold) 100%);color:#2a251e;border:1px solid rgba(184,134,11,.35)}.btn-difficulty-hard{background:linear-gradient(180deg,#d4b8a8 0%,var(--red-soft) 100%);color:#f8f4ef;border:1px solid rgba(156,83,68,.35)}.loading{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:var(--muted)}.spinner{width:48px;height:48px;border:3px solid var(--border-soft);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}.spinner.small{width:24px;height:24px;border-width:3px}@keyframes spin{to{transform:rotate(360deg)}}.game{flex:1;display:flex;flex-direction:column;overflow:hidden}.header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--surface);border-bottom:1px solid var(--border-soft);flex-shrink:0}.score-badge{display:flex;flex-direction:column;align-items:center;padding:6px 16px;border-radius:var(--radius-sm);transition:all .3s;min-width:70px;border:1px solid transparent}.score-badge.p1{background:var(--p1-dim);border-color:#8b691440}.score-badge.p2{background:var(--p2-dim);border-color:#9c534433}.score-badge.active{transform:scale(1.05)}.score-badge.active.p1{box-shadow:var(--shadow-gold);border-color:var(--gold)}.score-badge.active.p2{box-shadow:0 2px 12px #9c534433;border-color:var(--red-soft)}.score-badge:not(.active){opacity:.7}.player-name{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.player-score{font-size:22px;font-weight:700}.turn-info{display:flex;flex-direction:column;align-items:center;gap:2px}.timer{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--gold)}.timer.urgent{color:var(--error);animation:blink .5s ease-in-out infinite}@keyframes blink{50%{opacity:.4}}.pioche-count{font-size:12px;color:var(--muted)}.boards-container{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.board-section.opponent{order:1}.divider{order:2}.board-section.current{order:3}.board-section{flex:1;display:flex;flex-direction:column;padding:8px 12px;overflow-y:auto;min-height:0;transition:opacity .4s ease,filter .4s ease}.board-section.inactive-turn{opacity:.65;filter:saturate(.85)}.board-section.opponent{background:var(--surface)}.board-section.current{background:var(--bg)}.board-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-bottom:6px}.words-grid{display:flex;flex-direction:column;gap:5px;flex:1;min-height:0}.word-row{display:flex;align-items:center;gap:3px;padding:4px 6px;border-radius:var(--radius-sm);transition:all .2s}.word-row.clickable{cursor:pointer}.word-row.clickable:hover{background:var(--surface2)}.word-row.selected{background:#b8860b1f;box-shadow:inset 0 0 0 1px var(--gold)}.word-row.jarnac-target{cursor:pointer}.word-row.jarnac-target:hover{background:#b8860b1a}.word-row.jarnac-target.selected{background:#b8860b2e;box-shadow:inset 0 0 0 1px var(--jarnac)}.word-score{font-size:12px;font-weight:600;color:var(--gold);margin-left:6px;min-width:20px}.empty-board{color:var(--muted);font-size:13px;text-align:center;padding:16px;opacity:.6}.tile{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;border-radius:6px;flex-shrink:0;transition:all .2s}.current-tile{background:linear-gradient(180deg,#e8dfc9,#d9cfb8);color:var(--p1);border:1px solid rgba(139,105,20,.35);box-shadow:var(--shadow-soft)}.opponent-tile{background:linear-gradient(180deg,#ede4dc,#e0d4cc);color:var(--p2);border:1px solid rgba(156,83,68,.3);box-shadow:var(--shadow-soft)}.hand-tile{background:linear-gradient(180deg,var(--surface) 0%,var(--surface2) 100%);color:var(--text);border:1px solid var(--border-soft);width:36px;height:36px;font-size:18px}.hand-tile.new{animation:pop .5s cubic-bezier(.175,.885,.32,1.275);border-color:var(--gold);color:var(--gold);box-shadow:var(--shadow-gold)}@keyframes pop{0%{transform:scale(.5) rotate(-10deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.tile.small{width:26px;height:26px;font-size:13px;background:var(--surface2);color:var(--text);border:1px solid var(--border-soft)}.hand-display{display:flex;gap:4px;flex-wrap:wrap;padding:8px 0;justify-content:center}.opponent-hand{padding-top:4px}.empty-hand{font-size:12px;color:var(--muted);opacity:.5}.divider{display:flex;align-items:center;justify-content:center;padding:6px 12px;background:var(--surface);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft);flex-shrink:0;min-height:30px}.active-indicator{font-size:12px;font-weight:600;color:var(--gold);text-transform:uppercase;letter-spacing:2px}.active-indicator.jarnac-glow{color:var(--jarnac);text-shadow:0 0 8px rgba(184,134,11,.4);animation:pulse-text 1s ease-in-out infinite}@keyframes pulse-text{50%{text-shadow:0 0 12px rgba(184,134,11,.6)}}.message{padding:8px 16px;text-align:center;font-size:14px;font-weight:700;flex-shrink:0;animation:slide-in .3s ease}@keyframes slide-in{0%{transform:translateY(-10px);opacity:0}}.message.error{background:#9c53441f;color:var(--error);border-top:1px solid var(--red-soft)}.message.info{background:#5a7d5a1f;color:var(--green);border-top:1px solid var(--green)}.message.jarnac{background:#b8860b1f;color:var(--jarnac);border-top:1px solid var(--gold);font-size:18px;padding:12px}.action-bar{padding:10px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border-soft);flex-shrink:0;display:flex;flex-direction:column;gap:8px}.input-row{display:flex;gap:8px}.word-input{flex:1;padding:12px 16px;background:var(--bg);border:1px solid var(--border-soft);border-radius:var(--radius-sm);color:var(--text);font-family:inherit;font-size:18px;font-weight:600;letter-spacing:4px;text-transform:uppercase;outline:none;transition:border-color .2s,box-shadow .2s}.word-input:focus{border-color:var(--gold);box-shadow:0 0 0 2px #b8860b26}.word-input.jarnac-input:focus{border-color:var(--jarnac);box-shadow:0 0 0 2px #b8860b33}.word-input::placeholder{letter-spacing:0;font-weight:400;font-size:14px;color:var(--muted);text-transform:none}.action-row{display:flex;gap:8px;justify-content:center}.phase-hint{font-size:12px;color:var(--muted);text-align:center;opacity:.7}.jarnac-window{text-align:center}.jarnac-prompt{font-size:14px;color:var(--gold);margin-bottom:10px;font-weight:600}.jarnac-form{display:flex;flex-direction:column;gap:8px}.jarnac-instruction{font-size:13px;color:var(--jarnac);text-align:center}.jarnac-target-display{font-size:14px;color:var(--text);text-align:center;padding:6px;background:#b8860b1a;border-radius:var(--radius-sm);border:1px solid var(--border-soft)}.ai-thinking{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;color:var(--muted)}.gameover{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:24px;overflow-y:auto}.gameover h1{font-size:28px;font-weight:600;color:var(--text);text-align:center}.final-scores{display:flex;gap:24px}.final-score{display:flex;flex-direction:column;align-items:center;padding:16px 28px;border-radius:var(--radius);gap:6px;border:2px solid transparent}.final-score.p1{background:var(--p1-dim);border-color:#8b691466}.final-score.p2{background:var(--p2-dim);border-color:#9c534459}.final-score.winner{transform:scale(1.1);box-shadow:var(--shadow-gold);border-color:var(--gold)}.final-score .label{font-size:13px;text-transform:uppercase;letter-spacing:2px;color:var(--muted)}.final-score .value{font-size:48px;font-weight:700}.winner-badge{font-size:14px;font-weight:600;color:var(--gold);margin-top:4px}.final-words{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px}.final-player-words{display:flex;flex-direction:column;gap:4px}.final-player-words h3{font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}.final-word{display:flex;align-items:center;gap:6px;padding:4px 0;font-weight:500}.final-word .word-score{margin-left:4px}.final-word-row{display:flex;align-items:center;gap:3px;padding:4px 8px}.final-word-row .tile{width:28px;height:28px;font-size:14px}.final-word-score{font-size:12px;font-weight:600;color:var(--gold);margin-left:8px}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-soft);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border)}@media(max-width:380px){.tile{width:28px;height:28px;font-size:14px}.hand-tile{width:32px;height:32px;font-size:16px}.logo h1{font-size:36px;letter-spacing:4px}.timer{font-size:24px}.word-input{font-size:16px;padding:10px 12px}}@media(min-height:800px){.board-section{padding:12px 16px}.words-grid{gap:6px}.hand-display{padding:12px 0;gap:6px}}@media(orientation:landscape)and (max-height:500px){.board-section{padding:4px 8px}.tile{width:24px;height:24px;font-size:12px}.hand-tile{width:28px;height:28px;font-size:14px}.header{padding:4px 8px}.timer{font-size:20px}.action-bar{padding:6px 8px}.word-input{padding:8px 10px;font-size:14px}.btn{padding:8px 14px;font-size:13px}}@supports (padding: env(safe-area-inset-top)){.header{padding-top:max(8px,env(safe-area-inset-top))}.action-bar{padding-bottom:max(10px,env(safe-area-inset-bottom))}}@media(min-width:768px){.app{max-width:none;width:100%}.boards-container{flex-direction:row}.board-section[data-player="0"]{order:1}.divider{order:2;border-top:none;border-bottom:none;border-left:1px solid var(--border-soft);border-right:1px solid var(--border-soft);width:40px;padding:12px 6px}.board-section[data-player="1"]{order:3}.active-indicator{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);letter-spacing:4px;white-space:nowrap}.action-bar{align-items:center;padding:16px 24px}.input-row,.action-row,.jarnac-form{width:100%;max-width:600px;margin:0 auto}.jarnac-window{width:100%;max-width:400px;margin:0 auto}.gameover h1{font-size:42px}.final-scores{gap:48px}.final-words{flex-direction:row;max-width:800px;justify-content:center;gap:60px}}