.main-nav{background:#0006;border-bottom:1px solid rgba(255,255,255,.1);position:sticky;top:0;z-index:100}.nav-container{max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;height:56px}.nav-logo{font-size:1.5rem;font-weight:700;text-decoration:none;background:linear-gradient(135deg,#00d4aa,#00a8cc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.desktop-nav{display:flex;align-items:center;gap:.25rem}.nav-link{padding:.5rem 1rem;font-size:.95rem;font-weight:500;color:#b0b0c0;text-decoration:none;border-radius:6px;transition:all .2s ease;background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:.35rem}.nav-link:hover{color:#fff;background:#ffffff14}.nav-link.active{color:#00d4aa}.dropdown-arrow{font-size:.65rem;transition:transform .2s ease;margin-left:.15rem}.nav-dropdown{position:relative}.nav-dropdown:hover:after{content:"";position:absolute;top:100%;left:0;right:0;height:.25rem}.nav-dropdown-menu{position:absolute;top:calc(100% + .25rem);left:0;background:#1a1a2e;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:.5rem 0;min-width:180px;box-shadow:0 8px 24px #0006;animation:dropdownFadeIn .15s ease}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{display:block;padding:.6rem 1rem;font-size:.9rem;color:#b0b0c0;text-decoration:none;transition:all .15s ease}.dropdown-item:hover{color:#fff;background:#ffffff14}.dropdown-item.active{color:#00d4aa;background:#00d4aa1a}.dropdown-divider{height:1px;background:#ffffff1a;margin:.5rem 0}.lang-button{font-family:inherit;letter-spacing:.05em}.lang-menu{right:0;left:auto;min-width:140px}.lang-menu .dropdown-item{width:100%;text-align:left;background:none;border:none;cursor:pointer;font-family:inherit}.mobile-lang-section{border-top:1px solid rgba(255,255,255,.1);margin-top:.75rem;padding-top:.5rem}.mobile-lang-options{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem 1rem}.mobile-lang-button{padding:.4rem .75rem;font-size:.85rem;color:#8888a0;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;cursor:pointer;transition:all .2s ease;font-family:inherit}.mobile-lang-button:hover{color:#fff;border-color:#fff3}.mobile-lang-button.active{color:#00d4aa;border-color:#00d4aa4d;background:#00d4aa1a}.mobile-menu-button{display:none;padding:.5rem;background:none;border:none;cursor:pointer}.hamburger{display:flex;flex-direction:column;justify-content:space-between;width:24px;height:18px}.hamburger span{display:block;width:100%;height:2px;background:#b0b0c0;border-radius:1px;transition:all .3s ease}.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.mobile-nav{display:none;background:#0000004d;border-top:1px solid rgba(255,255,255,.1);padding:1rem}.mobile-nav-link{display:block;padding:.75rem 1rem;font-size:1rem;font-weight:500;color:#b0b0c0;text-decoration:none;border-radius:6px;transition:all .2s ease}.mobile-nav-link:hover,.mobile-nav-link.active{color:#00d4aa;background:#00d4aa1a}.mobile-nav-section{margin-top:.5rem}.mobile-nav-submenu{margin-left:1rem;padding-left:1rem;border-left:2px solid rgba(255,255,255,.1);margin-top:.25rem}.mobile-nav-sublink{display:block;padding:.5rem 1rem;font-size:.9rem;color:#8888a0;text-decoration:none;border-radius:4px;transition:all .2s ease}.mobile-nav-sublink:hover,.mobile-nav-sublink.active{color:#00d4aa;background:#00d4aa14}@media (max-width: 768px){.nav-container{padding:0 1rem}.desktop-nav{display:none}.mobile-menu-button,.mobile-nav{display:block}}@media (max-width: 400px){.nav-container{padding:0 .75rem;height:52px}.nav-logo{font-size:1.25rem}}.landing-page{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#e8e8e8}.landing-main{flex:1;max-width:900px;margin:0 auto;width:100%;padding:0 1.5rem}.landing-hero{padding:5rem 0 4rem;text-align:center}.hero-title{font-size:2.8rem;font-weight:700;line-height:1.2;margin:0 0 1.25rem;color:#fff}.hero-accent{color:#00d4aa}.hero-subtitle{font-size:1.1rem;color:#b0b0c0;max-width:580px;margin:0 auto 2rem;line-height:1.7}.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.landing-btn-primary{display:inline-block;padding:.875rem 2rem;background:#00d4aa;color:#1a1a2e;font-weight:600;font-size:1rem;border-radius:8px;text-decoration:none;transition:background .2s ease}.landing-btn-primary:hover{background:#00b894}.landing-btn-secondary{display:inline-block;padding:.875rem 2rem;background:transparent;color:#e8e8e8;font-weight:500;font-size:1rem;border-radius:8px;border:1px solid rgba(255,255,255,.2);text-decoration:none;transition:all .2s ease}.landing-btn-secondary:hover{border-color:#fff6;background:#ffffff0d}.landing-section-title{font-size:1.5rem;font-weight:600;color:#fff;margin:0 0 1.5rem}.landing-modes{padding:3rem 0;border-top:1px solid rgba(255,255,255,.08)}.landing-mode-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.landing-mode-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.75rem;display:flex;flex-direction:column;gap:.75rem}.landing-mode-title{font-size:1.15rem;font-weight:600;color:#fff;margin:0}.landing-mode-desc{font-size:.95rem;color:#b0b0c0;line-height:1.65;margin:0;flex:1}.landing-mode-link{color:#00d4aa;text-decoration:none;font-weight:500;font-size:.95rem;align-self:flex-start;transition:opacity .2s}.landing-mode-link:hover{opacity:.75}.landing-learn-section{padding:3rem 0 4.5rem;border-top:1px solid rgba(255,255,255,.08)}.landing-learn-desc{font-size:1rem;color:#b0b0c0;line-height:1.7;max-width:560px;margin:0 0 1.5rem}.landing-footer{background:#0000004d;border-top:1px solid rgba(255,255,255,.1);padding:2.5rem 1.5rem 2rem}.landing-footer-inner{max-width:900px;margin:0 auto}.landing-footer-cols{display:flex;gap:4rem;margin-bottom:2rem}.landing-footer-col{display:flex;flex-direction:column;gap:.5rem}.landing-footer-col h4{font-size:.85rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px;margin:0 0 .5rem}.landing-footer-col a{color:#8888a0;text-decoration:none;font-size:.9rem;transition:color .2s ease}.landing-footer-col a:hover{color:#00d4aa}.landing-footer-copy{color:#5a5a70;font-size:.85rem;margin:0;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.05)}.landing-footer-policy{color:#5a5a70;text-decoration:none;transition:color .2s}.landing-footer-policy:hover{color:#8888a0}@media (max-width: 700px){.landing-mode-cards{grid-template-columns:1fr}}@media (max-width: 500px){.landing-main{padding:0 1rem}.landing-hero{padding:3rem 0 2.5rem}.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.landing-footer-cols{flex-direction:column;gap:1.5rem}}.auth-screen{min-height:100vh;display:flex;flex-direction:column;background:var(--color-bg, #1a1a2e)}.auth-header{padding:1.5rem;text-align:center}.auth-header .header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.auth-header .header-spacer{width:60px}.auth-header h1{margin:0;font-size:2.5rem;color:var(--color-text, #eee)}.auth-header .tagline{margin:.5rem 0 0;color:var(--color-text-secondary, #888);font-size:1rem}.auth-main{flex:1;display:flex;justify-content:center;padding:1rem}.auth-card{background:var(--color-surface, #252545);border-radius:12px;padding:2rem;width:100%;max-width:400px}.auth-card h2{margin:0 0 1.5rem;text-align:center;color:var(--color-text, #eee)}.form-field{margin-bottom:1rem}.form-field label{display:block;margin-bottom:.5rem;color:var(--color-text-secondary, #aaa);font-size:.875rem}.form-field input{width:100%;padding:.75rem;border:1px solid var(--color-border, #3a3a5a);border-radius:6px;background:var(--color-bg, #1a1a2e);color:var(--color-text, #eee);font-size:1rem;box-sizing:border-box}.form-field input:focus{outline:none;border-color:var(--color-primary, #6366f1)}.form-field input::placeholder{color:var(--color-text-muted, #555)}.form-field input:disabled{opacity:.6;cursor:not-allowed}.auth-error{background:#f87171;color:#1a1a2e;padding:.75rem;border-radius:6px;margin-bottom:1rem;font-size:.875rem}.confirm-hint{color:var(--color-text-secondary, #aaa);font-size:.875rem;margin-bottom:1rem;text-align:center}.auth-submit{width:100%;padding:.875rem;background:var(--color-primary, #6366f1);color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:background .2s}.auth-submit:hover:not(:disabled){background:var(--color-primary-hover, #4f46e5)}.auth-submit:disabled{opacity:.6;cursor:not-allowed}.auth-footer{margin-top:1.5rem;text-align:center;color:var(--color-text-secondary, #aaa);font-size:.875rem}.link-button{background:none;border:none;color:var(--color-primary, #6366f1);cursor:pointer;font-size:inherit;padding:0;text-decoration:underline}.link-button:hover{color:var(--color-primary-hover, #4f46e5)}.guest-section{margin-top:1.5rem}.divider{display:flex;align-items:center;margin-bottom:1rem}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--color-border, #3a3a5a)}.divider span{padding:0 1rem;color:var(--color-text-secondary, #888);font-size:.875rem}.guest-button{width:100%;padding:.875rem;background:transparent;color:var(--color-text, #eee);border:1px solid var(--color-border, #3a3a5a);border-radius:6px;font-size:1rem;cursor:pointer;transition:background .2s,border-color .2s}.guest-button:hover{background:var(--color-surface-hover, #2a2a4a);border-color:var(--color-text-secondary, #888)}.session-start-screen{flex:1;display:flex;flex-direction:column;align-items:center;padding:2rem;color:#e8e8e8}.start-header{text-align:center;margin-bottom:3rem;width:100%;max-width:600px}.header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.user-info{display:flex;align-items:center;gap:.75rem}.user-email{font-size:.85rem;color:#8888a0}.logout-button{padding:.4rem .75rem;font-size:.8rem;background:transparent;color:#8888a0;border:1px solid rgba(255,255,255,.15);border-radius:6px;cursor:pointer;transition:all .2s ease}.logout-button:hover{color:#fff;border-color:#ffffff4d;background:#ffffff0d}.start-header h1{font-size:3rem;font-weight:700;margin:0;background:linear-gradient(135deg,#00d4aa,#00a8cc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tagline{font-size:1.1rem;color:#8888a0;margin-top:.5rem}.training-description{font-size:.9rem;color:#8888a0;margin-top:.75rem}.inline-learn-link{color:#00d4aa;text-decoration:none;transition:opacity .2s ease}.inline-learn-link:hover{opacity:.8}.start-main{width:100%;max-width:600px}.game-modes{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.mode-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1.25rem 1.5rem;cursor:pointer;transition:all .2s ease}.mode-card:hover{background:#ffffff14;border-color:#ffffff26}.mode-card.expanded{cursor:default;border-color:#00d4aa4d}.mode-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.mode-card h2{font-size:1.2rem;font-weight:600;margin:0;color:#fff}.mode-desc{font-size:.85rem;color:#8888a0;margin:.25rem 0 0}.mode-learn-link{font-size:.75rem;color:#00d4aa;text-decoration:none;transition:opacity .2s ease}.mode-learn-link:hover{opacity:.8}.play-button{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1.5rem;font-size:.95rem;font-weight:600;background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap;flex-shrink:0}.play-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #00d4aa4d}.play-button:disabled{opacity:.5;cursor:not-allowed}.mode-expand{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.08)}.board-size-selector{display:flex;gap:.5rem;margin-bottom:.75rem}.board-size-chip{padding:.4rem .85rem;font-size:.85rem;font-weight:500;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:20px;color:#aaa;cursor:pointer;transition:all .15s ease}.board-size-chip:hover{background:#ffffff1a;color:#fff}.board-size-chip.active{background:#00a8cc26;border-color:#00a8cc;color:#00a8cc}.phase-toggles{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.phase-chip{padding:.4rem .85rem;font-size:.85rem;font-weight:500;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:20px;color:#aaa;cursor:pointer;transition:all .15s ease}.phase-chip:hover{background:#ffffff1a;color:#fff}.phase-chip.active{background:#00d4aa26;border-color:#00d4aa;color:#00d4aa}.error-message{background:#ff6b6b1a;border:1px solid #ff6b6b;border-radius:8px;padding:.75rem 1rem;margin-bottom:1rem;color:#ff6b6b;font-size:.9rem}.history-summary{background:#ffffff0d;border-radius:12px;padding:1.25rem 1.5rem}.history-summary h3{font-size:1.1rem;margin:0 0 1rem;color:#fff}.history-stats{display:flex;gap:2rem;margin-bottom:1.5rem}.stat{display:flex;flex-direction:column;gap:.25rem}.stat-value{font-size:1.5rem;font-weight:700;color:#00d4aa}.stat-label{font-size:.75rem;color:#8888a0;text-transform:uppercase;letter-spacing:.5px}.reset-button{padding:.5rem 1rem;font-size:.85rem;background:transparent;color:#ff6b6b;border:1px solid #ff6b6b;border-radius:8px;cursor:pointer;transition:all .2s ease}.reset-button:hover{background:#ff6b6b1a}.sente-or-gote{min-height:100vh;background:#1a1a2e;color:#eee;padding:20px}.sente-or-gote.loading,.sente-or-gote.error,.sente-or-gote.empty,.sente-or-gote.complete{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.2rem;gap:20px}.sente-or-gote.complete h1{font-size:2rem;color:#81c784}.sente-or-gote.complete .final-score{font-size:1.5rem;color:#fff}.complete-actions{display:flex;gap:12px}.complete-btn{padding:12px 28px;font-size:1rem;border-radius:8px;cursor:pointer;text-decoration:none;font-weight:500;border:none}.complete-btn.primary{background:#2196f3;color:#fff}.complete-btn.secondary{background:transparent;color:#aaa;border:1px solid #444}.complete-btn:hover{opacity:.85}.game-header{display:flex;justify-content:space-between;align-items:center;max-width:800px;margin:0 auto 20px;padding:10px 20px;background:#252540;border-radius:8px}.game-header .mode-title{font-weight:700;color:#fff;font-size:1.1rem}.game-header .progress{color:#aaa}.game-header .score{font-weight:700;color:#81c784}.game-content{max-width:800px;margin:0 auto;display:flex;gap:30px;flex-wrap:wrap;justify-content:center}.board-section{flex-shrink:0}.game-board-svg{display:block;border-radius:4px}.question-section{flex:1;min-width:280px;display:flex;flex-direction:column;gap:15px}.question-section h2{margin:0;font-size:1.2rem;color:#fff}.question-section .prompt{color:#aaa;margin:0}.answer-buttons{display:flex;gap:15px;flex-wrap:wrap}.answer-buttons button{flex:1;min-width:140px;padding:20px;font-size:1.1rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;transition:transform .1s,box-shadow .1s}.answer-buttons button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.sente-btn,.gote-btn{background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e}.reveal-btn{background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff;width:100%}.result-section{display:flex;flex-direction:column;gap:15px}.result{font-size:1.5rem;font-weight:700;padding:10px 20px;border-radius:8px;text-align:center}.result.correct{background:#4caf5033;color:#81c784}.result.wrong{background:#f4433633;color:#e57373}.explanation{background:#252540;padding:15px;border-radius:8px}.explanation p{margin:0 0 10px;color:#ccc}.explanation .punishment{color:#e57373;font-weight:700}.candidates-list{margin-top:15px}.candidates-list h4{margin:0 0 8px;color:#aaa;font-size:.9rem}.candidate{padding:6px 10px;margin:4px 0;border-radius:4px;font-size:.9rem;display:flex;justify-content:space-between;align-items:center}.candidate.local{background:#ff980033;color:#ffb74d}.candidate.tenuki{background:#4caf5033;color:#81c784}.candidate .tag{font-size:.75rem;padding:2px 6px;border-radius:4px;background:#0003}.next-btn{padding:12px 24px;font-size:1rem;background:#2196f3;color:#fff;border:none;border-radius:8px;cursor:pointer;align-self:center}.next-btn:hover{background:#1976d2}@media (max-width: 700px){.game-content{flex-direction:column;align-items:center}.question-section{width:100%}}.area-control-overlay{pointer-events:none}.control-cell{transition:fill .2s ease}.training-board-container{display:flex;flex-direction:column;align-items:center;gap:.4rem}.mode-toolbar{display:flex;justify-content:space-between;align-items:center;width:100%;padding:.35rem .5rem;background:#ffffff0d;border-radius:8px}.mode-buttons{display:flex;gap:.25rem}.mode-btn{display:flex;align-items:center;gap:0;padding:.4rem .5rem;font-size:.8rem;font-weight:500;background:#ffffff14;color:#e8e8e8;border:1px solid rgba(255,255,255,.15);border-radius:6px;cursor:pointer;transition:all .2s ease;overflow:hidden}.mode-btn:hover{background:#ffffff26;gap:.35rem;padding-right:.6rem}.mode-btn.active{background:#00d4aa33;border-color:#00d4aa;color:#00d4aa}.mode-icon{font-size:1rem;line-height:1;flex-shrink:0}.mode-label{font-size:.7rem;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transition:all .2s ease}.mode-btn:hover .mode-label{max-width:80px;opacity:1}.nav-btn{display:flex;align-items:center;gap:0;padding:.4rem .5rem;font-size:.8rem;background:#ffffff14;color:#e8e8e8;border:1px solid rgba(255,255,255,.15);border-radius:6px;cursor:pointer;transition:all .2s ease;overflow:hidden}.nav-btn:hover{background:#ffffff26;gap:.35rem;padding-left:.6rem}.next-scenario-btn{display:flex;align-items:center;gap:0;margin-left:auto;padding:.4rem .5rem;font-size:.85rem;font-weight:600;background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;overflow:hidden}.next-scenario-btn:hover:not(:disabled){gap:.35rem;padding-left:.75rem;box-shadow:0 4px 12px #00d4aa4d}.next-scenario-btn:disabled{opacity:.5;cursor:not-allowed;background:#ffffff1a;color:#8888a0}.btn-icon{font-size:1rem;line-height:1;flex-shrink:0}.btn-label{font-size:.7rem;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transition:all .2s ease}.nav-btn:hover .btn-label,.next-scenario-btn:hover:not(:disabled) .btn-label{max-width:120px;opacity:1}.board-legend{display:flex;gap:1rem;padding:.3rem .75rem;background:#ffffff0d;border-radius:6px;font-size:.75rem;color:#c8c8d8}.legend-item{display:flex;align-items:center;gap:.3rem}.legend-item .icon{font-size:.9rem}.legend-item .icon.crown,.legend-item .icon.circle{color:gold}.legend-item .icon.marker{color:#48f}.legend-item .icon.star{color:gold}.legend-gradient{width:40px;height:10px;border-radius:2px;background:linear-gradient(to right,#b4aa32,#328c3c)}.training-board{border-radius:6px;overflow:hidden;box-shadow:0 4px 16px #0000004d;position:relative}.feedback-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 2.5rem;border-radius:16px;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;animation:feedbackFadeIn .2s ease-out,feedbackFadeOut .3s ease-in 2.2s forwards;z-index:10}@keyframes feedbackFadeIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes feedbackFadeOut{0%{opacity:1}to{opacity:0}}.feedback-icon{font-size:3rem;line-height:1;margin-bottom:.5rem}.feedback-points{font-size:2.5rem;font-weight:700;line-height:1;margin-bottom:.25rem}.feedback-text{font-size:1rem;opacity:.9}.feedback-overlay.best{background:#000000d9;border:2px solid #ffd700;box-shadow:0 0 30px #ffd7004d}.feedback-overlay.best .feedback-icon{color:gold;text-shadow:0 0 20px rgba(255,215,0,.6)}.feedback-overlay.best .feedback-text{color:gold}.feedback-overlay.good{background:#000000d9;border:2px solid #00d4aa}.feedback-overlay.good .feedback-points,.feedback-overlay.good .feedback-text{color:#00d4aa}.feedback-overlay.okay{background:#000000d9;border:2px solid #ffc864}.feedback-overlay.okay .feedback-points,.feedback-overlay.okay .feedback-text{color:#ffc864}.feedback-overlay.poor{background:#000000d9;border:2px solid #ff6b6b}.feedback-overlay.poor .feedback-points,.feedback-overlay.poor .feedback-text{color:#ff6b6b}.feedback-overlay.blunder{background:#000000d9;border:2px solid #a855f7}.feedback-overlay.blunder .feedback-points,.feedback-overlay.blunder .feedback-text{color:#a855f7}.training-board-empty{display:flex;align-items:center;justify-content:center;width:400px;height:400px;background:#ffffff0d;border-radius:6px;color:#8888a0}.board-svg{display:block}.stone{filter:drop-shadow(1px 2px 2px rgba(0,0,0,.3))}.answers-tooltip{animation:tooltipFadeIn .15s ease-out}@keyframes tooltipFadeIn{0%{opacity:0}to{opacity:1}}.intersection:hover{opacity:.3}.best-marker{pointer-events:none;filter:drop-shadow(0 0 3px rgba(255,215,0,.6))}.anchor-marker,.selected-marker{cursor:grab;transition:transform .1s ease}.anchor-marker:hover,.selected-marker:hover{transform:scale(1.1)}.anchor-marker.dragging,.selected-marker.dragging{opacity:.5;cursor:grabbing}.board-controls-panel{display:flex;flex-direction:column;align-items:center;gap:.4rem;min-height:36px}.lock-button{padding:.5rem 1.5rem;font-size:.9rem;font-weight:600;background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.lock-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00d4aa4d}.exploration-indicator{padding:.3rem .75rem;font-size:.8rem;color:#8888a0;background:#ffffff0d;border-radius:6px}.mode-help{padding:.3rem .75rem;font-size:.75rem;color:#8888a0;background:#ffffff08;border-radius:6px;text-align:center}.move-info{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;border-radius:6px;font-size:.85rem}.move-info.best{background:#ffd70026;color:gold}.move-info.good{background:#00d4aa26;color:#00d4aa}.move-info.okay{background:#ffc86426;color:#ffc864}.move-info.poor{background:#ff6b6b26;color:#ff6b6b}.move-info.blunder{background:#a855f726;color:#a855f7}.best-indicator{font-size:1rem}.points-lost{font-weight:700;font-size:1rem}.move-label{font-size:.8rem;opacity:.8}@media (max-width: 768px){.training-board-container{gap:.25rem}.mode-toolbar{padding:.25rem;flex-wrap:wrap;gap:.25rem}.mode-buttons{gap:.15rem}.mode-btn{padding:.5rem;min-width:44px;min-height:44px;justify-content:center}.mode-icon{font-size:1.1rem}.mode-label{max-width:none;opacity:1;font-size:.65rem}.mode-btn{gap:.25rem;padding:.4rem .5rem}.nav-btn{padding:.5rem;min-width:44px;min-height:44px}.btn-label{max-width:none;opacity:1;font-size:.65rem}.nav-btn{gap:.25rem}.next-scenario-btn{padding:.5rem .75rem;min-height:44px;gap:.25rem}.next-scenario-btn .btn-label{max-width:none;opacity:1;font-size:.7rem}.board-legend{padding:.25rem .5rem;gap:.5rem;font-size:.65rem;flex-wrap:wrap;justify-content:center}.legend-item .icon{font-size:.8rem}.board-controls-panel{gap:.25rem;min-height:44px}.lock-button{padding:.6rem 1.25rem;font-size:.85rem;min-height:44px}.move-info{padding:.35rem .6rem;font-size:.8rem}.points-lost{font-size:.9rem}.mode-help{font-size:.65rem;padding:.2rem .5rem}.exploration-indicator{font-size:.7rem;padding:.2rem .5rem}}@media (max-width: 400px){.mode-toolbar{padding:.2rem}.mode-btn,.nav-btn{padding:.35rem .4rem;min-width:40px;min-height:40px}.mode-label,.btn-label{display:none}.next-scenario-btn .btn-label{display:inline;font-size:.6rem}.board-legend{font-size:.6rem;gap:.4rem}}.history-sidebar{background:#ffffff0d;border-radius:8px;padding:.5rem;height:100%;display:flex;flex-direction:column;overflow:hidden}.history-sidebar h3{margin:0 0 .5rem;padding:0 .25rem;font-size:.85rem;color:#e8e8e8}.history-sidebar.empty{justify-content:flex-start}.empty-message{color:#8888a0;font-size:.75rem;text-align:center;margin-top:1rem}.history-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.25rem}.history-item{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:.35rem .5rem;cursor:pointer;transition:all .2s ease}.history-item:hover{background:#ffffff14;border-color:#ffffff26}.history-item.selected{background:#00d4aa14;border-color:#00d4aa4d}.history-item.current{border-color:#00d4aa}.history-item-main{display:flex;align-items:center;gap:.4rem}.phase-tag{padding:.1rem .3rem;border-radius:3px;font-weight:600;font-size:.6rem}.phase-tag.early{background:#64c8ff33;color:#64c8ff}.phase-tag.mid{background:#ffc86433;color:#ffc864}.phase-tag.late{background:#ff828233;color:#ff8282}.points-badge{padding:.15rem .4rem;border-radius:4px;font-weight:700;font-size:.8rem}.points-badge.best{background:#ffd70026;color:gold}.points-badge.good{background:#00d4aa26;color:#00d4aa}.points-badge.okay{background:#ffc86426;color:#ffc864}.points-badge.poor{background:#ff6b6b26;color:#ff6b6b}.points-badge.blunder{background:#a855f726;color:#a855f7}.best-star{font-size:.9rem}.history-item-preview{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:.35rem}.mini-board{align-self:center;border-radius:3px;overflow:hidden}.preview-description{margin:0;font-size:.7rem;color:#8888a0;text-align:center}.session-stats{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:#ffffff0d;border-radius:10px}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.15rem}.stat-value{font-size:1.1rem;font-weight:700;color:#00d4aa}.stat-label{font-size:.65rem;color:#8888a0;text-transform:uppercase;letter-spacing:.3px}.stat-divider{width:1px;height:24px;background:#ffffff1a}.scenario-info{display:flex;align-items:center;gap:1rem;padding:.75rem 1.25rem;background:#ffffff0d;border-radius:12px;max-width:100%}.phase-badge{padding:.35rem .75rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border-radius:6px;flex-shrink:0}.phase-badge.early{background:#64c8ff26;color:#64c8ff}.phase-badge.mid{background:#ffc86426;color:#ffc864}.phase-badge.late{background:#ff828226;color:#ff8282}.scenario-description{flex:1;margin:0;font-size:.95rem;color:#c8c8d8}.turn-indicator{font-size:.9rem;color:#8888a0;flex-shrink:0}.popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.popup-content{background:var(--color-surface, #1e1e1e);border-radius:16px;padding:32px;max-width:400px;width:90%;text-align:center;box-shadow:0 8px 32px #0006;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.popup-content h2{margin:0 0 24px;font-size:1.75rem;color:var(--color-text, #ffffff)}.score-display{margin-bottom:24px}.score-main{display:flex;flex-direction:column;align-items:center;gap:4px}.score-value{font-size:3rem;font-weight:700;color:var(--color-primary, #00d4aa)}.score-label{font-size:.875rem;color:var(--color-text-muted, #888);text-transform:uppercase;letter-spacing:.1em}.score-subtitle{margin:8px 0 0;font-size:.875rem;color:var(--color-text-muted, #888)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.stat-box{background:var(--color-surface-alt, #2a2a2a);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:4px}.stat-number{font-size:1.5rem;font-weight:600;color:var(--color-text, #ffffff)}.stat-number.perfect{color:gold}.stat-number.blunder{color:#a855f7}.stat-text{font-size:.75rem;color:var(--color-text-muted, #888);text-transform:uppercase;letter-spacing:.05em}.popup-actions{display:flex;gap:12px}.popup-button{flex:1;padding:12px 20px;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .15s ease;border:none}.popup-button.primary{background:var(--color-primary, #00d4aa);color:#000}.popup-button.primary:hover{background:var(--color-primary-hover, #00e6bb)}.popup-button.secondary{background:var(--color-surface-alt, #2a2a2a);color:var(--color-text, #ffffff);border:1px solid var(--color-border, #444)}.popup-button.secondary:hover{background:var(--color-surface-hover, #333)}.training-screen{flex:1;display:flex;flex-direction:column;color:#e8e8e8;overflow:hidden;min-height:0}.training-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:#0003;border-bottom:1px solid rgba(255,255,255,.1);flex-shrink:0}.header-left{display:flex;align-items:center;gap:1rem}.header-right{display:flex;gap:.5rem}.header-button{padding:.35rem .75rem;font-size:.8rem;background:#ffffff1a;color:#e8e8e8;border:1px solid rgba(255,255,255,.2);border-radius:6px;cursor:pointer;transition:all .2s ease}.header-button:hover{background:#fff3}.help-link{text-decoration:none;color:#00d4aa;border-color:#00d4aa4d}.help-link:hover{background:#00d4aa1a}.header-button.danger{color:#ff6b6b;border-color:#ff6b6b4d}.header-button.danger:hover{background:#ff6b6b1a}.training-main{flex:1;display:flex;padding:.75rem 1rem;gap:1rem;overflow:hidden;min-height:0}.board-section{flex:1;display:flex;flex-direction:column;align-items:center;gap:.5rem;min-height:0}.board-controls{display:flex;align-items:center;gap:1rem;flex-shrink:0}.control-button{padding:.5rem 1.5rem;font-size:.9rem;font-weight:600;background:#ffffff1a;color:#e8e8e8;border:1px solid rgba(255,255,255,.2);border-radius:8px;cursor:pointer;transition:all .2s ease}.control-button:hover:not(:disabled){background:#fff3}.control-button:disabled{opacity:.5;cursor:not-allowed}.control-button.primary{background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e;border:none}.control-button.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #00d4aa4d}.instruction{font-size:.8rem;color:#8888a0;text-align:center;margin:0}.sidebar-section{width:280px;flex-shrink:0;display:flex;flex-direction:column;min-height:0}@media (max-width: 1024px){.training-main{flex-direction:column;padding:.5rem;gap:.5rem}.sidebar-section{width:100%;max-height:180px}}@media (max-width: 768px){.training-header{padding:.4rem .75rem;flex-wrap:wrap;gap:.5rem}.header-left{gap:.75rem}.header-left h1{font-size:1rem}.header-button{padding:.3rem .5rem;font-size:.75rem}.training-main{flex-direction:column;padding:.25rem;gap:.25rem}.board-section{gap:.25rem}.sidebar-section{display:none}}@media (max-width: 400px){.training-header{padding:.3rem .5rem}.header-left h1{font-size:.9rem}.header-right{gap:.25rem}.header-button{padding:.25rem .4rem;font-size:.7rem}}.play-page{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#1a1a2e,#16213e)}.play-page-training{height:100vh;overflow:hidden}.play-page .app-loading{flex:1;display:flex;align-items:center;justify-content:center}.static-page{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#e8e8e8}.static-layout{flex:1;display:flex;max-width:1200px;margin:0 auto;width:100%;padding:0 1.5rem}.learn-sidebar{width:200px;flex-shrink:0;padding:2rem 0;margin-right:2rem;border-right:1px solid rgba(255,255,255,.08);overflow:hidden}.sidebar-nav{position:sticky;top:80px}.sidebar-section{margin-bottom:1.5rem}.sidebar-section:last-child{margin-bottom:0}.sidebar-title{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#8888a0;margin:0 0 .75rem;padding-left:.75rem}.sidebar-links{list-style:none;margin:0;padding:0}.sidebar-links li{margin:0}.sidebar-link{display:block;padding:.5rem .75rem;font-size:.9rem;color:#b0b0c0;text-decoration:none;border-radius:6px;transition:all .15s ease;border-left:2px solid transparent}.sidebar-link:hover{color:#fff;background:#ffffff0d}.sidebar-link.active{color:#00d4aa;background:#00d4aa14;border-left-color:#00d4aa}.sidebar-link.sidebar-cta{color:#00d4aa;font-weight:500}.sidebar-link.sidebar-cta:hover{background:#00d4aa1a}.static-content{flex:1;padding:2rem 0 3rem;min-width:0}.content-container{max-width:720px}.static-footer{background:#0000004d;border-top:1px solid rgba(255,255,255,.1);padding:2.5rem 1.5rem 2rem;margin-top:auto}.footer-container{max-width:1200px;margin:0 auto}.footer-sections{display:flex;gap:4rem;margin-bottom:2rem}.footer-section{display:flex;flex-direction:column;gap:.5rem}.footer-section h4{font-size:.85rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px;margin:0 0 .5rem}.footer-section a{color:#8888a0;text-decoration:none;font-size:.9rem;transition:color .2s ease}.footer-section a:hover{color:#00d4aa}.footer-copyright{color:#5a5a70;font-size:.85rem;margin:0;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.05)}@media (max-width: 900px){.static-layout{flex-direction:column;padding:0 1rem}.learn-sidebar{width:100%;padding:1rem 0;padding-right:0;border-right:none;border-bottom:1px solid rgba(255,255,255,.08)}.sidebar-nav{position:static;display:flex;gap:1.5rem;align-items:flex-start}.sidebar-section{margin-bottom:0}.sidebar-title{display:block;font-size:.7rem;margin-bottom:.5rem;padding-left:0}.sidebar-links{display:flex;flex-wrap:wrap;gap:.4rem}.sidebar-link{padding:.4rem .75rem;font-size:.85rem;border-left:none;border-radius:20px;background:#ffffff0d}.sidebar-link:hover{background:#ffffff1a}.sidebar-link.active{background:#00d4aa26;border-left:none}.sidebar-link.sidebar-cta{background:#00d4aa26}.static-content{padding:2rem 0}}@media (max-width: 600px){.static-layout{padding:0 1rem}.learn-sidebar{padding:.75rem 0;overflow-x:auto;-webkit-overflow-scrolling:touch}.sidebar-links{flex-wrap:nowrap;gap:.4rem}.sidebar-link{white-space:nowrap;padding:.35rem .6rem;font-size:.8rem}.static-content{padding:1.5rem 0}.footer-sections{flex-direction:column;gap:1.5rem}}.page-header{margin-bottom:3rem;text-align:center}.page-title{font-size:2.5rem;font-weight:700;margin:0 0 .75rem;background:linear-gradient(135deg,#00d4aa,#00a8cc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2}.page-subtitle{font-size:1.15rem;color:#8888a0;margin:0;line-height:1.5}@media (max-width: 768px){.page-header{margin-bottom:2rem}.page-title{font-size:2rem}.page-subtitle{font-size:1rem}}@media (max-width: 480px){.page-title{font-size:1.75rem}}.content-section{margin-bottom:3rem}.content-section:last-child{margin-bottom:0}.section-heading{font-size:1.5rem;font-weight:600;color:#fff;margin:0 0 1.25rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.section-body{font-size:1rem;line-height:1.7;color:#c8c8d8}.section-body p{margin:0 0 1rem}.section-body p:last-child{margin-bottom:0}.section-body ul,.section-body ol{margin:0 0 1rem;padding-left:1.5rem}.section-body li{margin-bottom:.5rem}.section-body a{color:#00d4aa;text-decoration:none;transition:color .2s ease}.section-body a:hover{color:#00f0c0;text-decoration:underline}.section-body strong{color:#fff;font-weight:600}.section-body img{max-width:100%;height:auto;border-radius:8px;margin:1.5rem 0}@media (max-width: 768px){.content-section{margin-bottom:2rem}.section-heading{font-size:1.3rem}.section-body{font-size:.95rem}}.callout-box{margin:1.5rem 0;padding:1.25rem;border-radius:8px;border-left:4px solid}.callout-tip{background:#00d4aa14;border-color:#00d4aa}.callout-note{background:#6366f114;border-color:#6366f1}.callout-warning{background:#ff6b6b14;border-color:#ff6b6b}.callout-key-concept{background:#ffc10714;border-color:#ffc107}.callout-title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}.callout-tip .callout-title{color:#00d4aa}.callout-note .callout-title{color:#6366f1}.callout-warning .callout-title{color:#ff6b6b}.callout-key-concept .callout-title{color:#ffc107}.callout-content{font-size:.95rem;line-height:1.6;color:#c8c8d8}.callout-content p{margin:0}.callout-content p+p{margin-top:.75rem}.resource-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin:1.5rem 0}.resource-card{display:block;padding:1.25rem;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;text-decoration:none;transition:all .2s ease}.resource-card:hover{background:#ffffff0f;border-color:#fff3;transform:translateY(-2px)}.resource-title{font-size:1.1rem;font-weight:600;color:#fff;margin:0 0 .5rem;display:flex;align-items:center;gap:.5rem}.external-icon{font-size:.85rem;color:#8888a0}.resource-description{font-size:.9rem;color:#8888a0;margin:0;line-height:1.5}@media (max-width: 600px){.resource-grid{grid-template-columns:1fr}}.board-diagram{margin:2rem 0;text-align:center}.diagram-image{max-width:100%;height:auto;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.diagram-caption{margin-top:.75rem;font-size:.9rem;color:#8888a0;font-style:italic}.content-image{margin:1.5rem 0;text-align:center}.content-image img{max-width:100%;border-radius:8px}.content-image figcaption{margin-top:.5rem;font-size:.9rem;color:#8888a0;font-style:italic}.start-training-cta{margin-top:3rem;text-align:center}.start-training-button{display:inline-block;padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;background:linear-gradient(135deg,#00d4aa,#00a8cc);color:#1a1a2e;text-decoration:none;border-radius:12px;transition:all .2s ease}.start-training-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00d4aa4d}.learn-sections-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;margin-top:2rem}.learn-section-card{display:block;padding:1.5rem;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;text-decoration:none;transition:all .2s ease}.learn-section-card:hover{background:#ffffff0f;border-color:#00d4aa4d;transform:translateY(-2px)}.section-card-title{font-size:1.25rem;font-weight:600;color:#fff;margin:0 0 .75rem}.section-card-description{font-size:.95rem;color:#8888a0;margin:0 0 1rem;line-height:1.5}.section-card-link{font-size:.9rem;font-weight:500;color:#00d4aa}.learn-section-card:hover .section-card-link{text-decoration:underline}@media (max-width: 700px){.learn-sections-grid{grid-template-columns:1fr}}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100vh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}.app-loading{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#1a1a2e}.loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:#6366f1;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5}#root{min-height:100vh;display:flex;flex-direction:column}