:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.5;font-weight:400;color:#333;background-color:#f5f5f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}#root{min-height:100vh}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit}button:focus-visible{outline:2px solid #4CAF50;outline-offset:2px}.challenge-selector{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:40px 20px;background:linear-gradient(135deg,#667eea,#764ba2)}.header{text-align:center;margin-bottom:40px;color:#fff}.header h1{font-size:3rem;margin:0 0 10px;text-shadow:0 2px 10px rgba(0,0,0,.2)}.tagline{font-size:1.2rem;opacity:.9;margin:0}.challenges{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;max-width:900px}.challenge-card{background:#fff;border-radius:20px;padding:30px;width:380px;max-width:90vw;cursor:pointer;border:none;text-align:left;transition:all .3s ease;box-shadow:0 10px 30px #0003}.challenge-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #0000004d}.challenge-card.square-locator:hover{box-shadow:0 20px 40px #4caf504d}.challenge-card.notation:hover{box-shadow:0 20px 40px #2196f34d}.challenge-card.writing:hover{box-shadow:0 20px 40px #ff98004d}.challenge-card.full-game:hover{box-shadow:0 20px 40px #9c27b04d}.challenge-icon{margin-bottom:20px}.challenge-card h2{font-size:1.6rem;color:#333;margin:0 0 15px}.challenge-card p{color:#666;line-height:1.6;margin:0 0 20px;font-size:.95rem}.challenge-features{display:flex;flex-wrap:wrap;gap:8px}.challenge-features span{background:#f0f0f0;padding:6px 12px;border-radius:20px;font-size:.8rem;color:#555}.footer{margin-top:auto;padding-top:40px}.home-link{color:#ffffffe6;text-decoration:none;font-size:1rem;padding:12px 24px;border:2px solid rgba(255,255,255,.5);border-radius:8px;transition:all .2s ease}.home-link:hover{background:#ffffff1a;border-color:#fff}@media(max-width:500px){.header h1{font-size:2.2rem}.challenge-card{padding:25px}.challenge-card h2{font-size:1.4rem}}.chess-board-container{display:flex;align-items:flex-start;gap:8px;-webkit-user-select:none;user-select:none}.rank-labels{display:flex;flex-direction:column;justify-content:space-around;height:min(70vw,480px);padding:0 4px}.rank-label{display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#666;height:calc(min(70vw,480px)/8)}.board-and-files{display:flex;flex-direction:column}.chess-board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:min(70vw,480px);height:min(70vw,480px);border:3px solid #333;border-radius:4px;overflow:hidden;box-shadow:0 4px 12px #0000004d}.file-labels{display:flex;justify-content:space-around;width:min(70vw,480px);padding:4px 0}.file-label{display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#666;width:calc(min(70vw,480px)/8)}.square{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .15s ease}.square.light{background-color:#f0d9b5}.square.dark{background-color:#b58863}.square:hover{filter:brightness(1.1)}.square.highlighted{background-color:#aaf0aa!important;box-shadow:inset 0 0 0 3px #4caf50}.square.selected{background-color:#fff59d!important;box-shadow:inset 0 0 0 3px #ffc107}.square.correct{background-color:#81c784!important;animation:pulse-correct .5s ease}.square.wrong{background-color:#e57373!important;animation:shake .3s ease}@keyframes pulse-correct{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.piece{width:80%;height:80%;display:flex;align-items:center;justify-content:center;pointer-events:none}.coordinate{position:absolute;top:2px;left:4px;font-size:10px;font-weight:700;color:#00000080;pointer-events:none}.square.dark .coordinate{color:#ffffff80}.square-challenge{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:600px;margin:0 auto}.square-challenge h2{margin:0 0 10px;color:#333;font-size:1.8rem}.square-challenge .description{color:#666;text-align:center;margin-bottom:30px;line-height:1.5}.setting-group{margin-bottom:25px}.stop-button{margin-top:20px;padding:12px 24px;font-size:1rem;background:#f44336;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.square-challenge.playing{padding:15px}.game-header{display:flex;flex-direction:column;align-items:center;gap:15px;margin-bottom:20px;width:100%}.target-square{display:flex;align-items:center;gap:15px;background:linear-gradient(135deg,#667eea,#764ba2);padding:15px 30px;border-radius:12px;box-shadow:0 4px 15px #667eea4d}.target-label{font-size:1.2rem;color:#fffc}.target-value{font-size:2.5rem;font-weight:700;color:#fff;font-family:Courier New,monospace;letter-spacing:2px}.perspective-indicator{font-size:.95rem;color:#666}.feedback{padding:15px 30px;border-radius:10px;font-size:1.2rem;font-weight:600;animation:slide-up .3s ease}.notation-challenge{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:600px;margin:0 auto}.notation-challenge h2{margin:0 0 10px;color:#333;font-size:1.8rem}.notation-challenge .description{color:#666;text-align:center;margin-bottom:30px;line-height:1.5}.mode-button:hover{border-color:#4caf50;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.settings{width:100%;margin-bottom:30px}.setting-group{margin-bottom:25px;text-align:center}.setting-description{margin-top:10px;font-size:.9rem;color:#888}.option-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.option-button{padding:12px 24px;border:2px solid #ddd;border-radius:8px;background:#fff;cursor:pointer;font-size:1rem;transition:all .2s ease}.option-button:hover{border-color:#4caf50}.option-button.selected{border-color:#4caf50;background:#4caf50;color:#fff}.action-buttons{display:flex;flex-direction:column;gap:15px;width:100%;max-width:300px}.notation-challenge.playing{padding:15px}.game-header{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:20px;width:100%}.move-display{display:flex;align-items:center;gap:15px;background:linear-gradient(135deg,#1e3c72,#2a5298);padding:15px 30px;border-radius:12px;box-shadow:0 4px 15px #1e3c724d}.move-label{font-size:1.2rem;color:#fffc}.move-notation{font-size:2.5rem;font-weight:700;color:#fff;font-family:Georgia,serif;letter-spacing:2px}.turn-indicator{font-size:1rem;color:#666;font-weight:500}.hint{background:#fff3e0;color:#e65100;padding:10px 20px;border-radius:8px;font-weight:500;animation:fade-in .3s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.feedback{padding:15px 30px;border-radius:10px;font-size:1.2rem;font-weight:600;animation:slide-up .3s ease;margin-bottom:15px}.notation-writing{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:600px;margin:0 auto;min-height:100vh;background:#fff}.notation-writing h2{margin:0 0 10px;color:#333;font-size:1.8rem}.notation-writing .description{color:#666;text-align:center;margin-bottom:30px;line-height:1.5}.mode-selection h3{text-align:center;color:#555;margin-bottom:20px}.settings{width:100%;margin-bottom:25px}.setting-group{margin-bottom:20px}.setting-group label{display:block;font-weight:600;color:#555;margin-bottom:12px;text-align:center}.difficulty-options{display:flex;flex-direction:column;gap:10px}.difficulty-option{display:flex;flex-direction:column;padding:15px 20px;border:2px solid #ddd;border-radius:10px;background:#fff;cursor:pointer;transition:all .2s ease;text-align:left}.difficulty-option:hover{border-color:#4caf50}.difficulty-option.selected{border-color:#4caf50;background:#e8f5e9}.diff-label{font-weight:600;color:#333;margin-bottom:4px}.diff-desc{font-size:.9rem;color:#666}.challenge-note{text-align:center;color:#888;font-size:.9rem;margin-top:10px}.perspective-indicator{font-size:.95rem;color:#666;margin-top:8px}.notation-help{background:#f8f9fa;border-radius:12px;padding:20px;margin-bottom:25px;width:100%}.notation-help h4{margin:0 0 15px;color:#555;text-align:center}.notation-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.example{display:flex;flex-direction:column;align-items:center;text-align:center}.example .notation{font-family:Georgia,serif;font-size:1.3rem;font-weight:700;color:#1e3c72;margin-bottom:4px}.example .meaning{font-size:.75rem;color:#888}.notation-writing.playing{padding:15px;background:linear-gradient(180deg,#f5f5f5,#e8e8e8)}.game-header{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:15px;width:100%}.game-info{display:flex;gap:20px;align-items:center}.question-count{font-size:1.1rem;color:#666;font-weight:500}.timer{font-size:1.5rem;font-weight:700;color:#4caf50;min-width:50px;text-align:center}.practice-stats{font-size:1.1rem;color:#666}.prompt{background:linear-gradient(135deg,#43a047,#66bb6a);padding:12px 25px;border-radius:10px;color:#fff;font-weight:500}.prompt-text{font-size:1.1rem}.game-board{margin-bottom:15px}.move-hint{display:flex;align-items:center;gap:10px;margin-bottom:15px;font-size:1.3rem;color:#555}.from-square,.to-square{background:#e3f2fd;padding:6px 14px;border-radius:6px;font-weight:600;font-family:monospace;color:#1565c0}.arrow{color:#999}.input-form{display:flex;gap:10px;margin-bottom:15px;width:100%;max-width:350px}.notation-input{flex:1;padding:15px 20px;font-size:1.5rem;font-family:Georgia,serif;text-align:center;border:3px solid #ddd;border-radius:10px;outline:none;transition:all .2s ease;text-transform:none}.notation-input:focus{border-color:#4caf50;box-shadow:0 0 0 3px #4caf5033}.notation-input.correct{border-color:#4caf50;background:#e8f5e9}.notation-input.wrong,.notation-input.timeout{border-color:#f44336;background:#ffebee}.submit-button{padding:15px 25px;font-size:1.1rem;font-weight:600;background:#4caf50;color:#fff;border:none;border-radius:10px;cursor:pointer;transition:all .2s ease}.submit-button:hover:not(:disabled){background:#43a047}.submit-button:disabled{background:#ccc;cursor:not-allowed}.game-controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:15px}.stop-button{padding:10px 20px;font-size:.95rem;background:#f44336;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.stop-button:hover{background:#d32f2f}.keyboard-shortcuts{font-size:.85rem;color:#888}.keyboard-shortcuts kbd{background:#eee;padding:2px 8px;border-radius:4px;font-family:monospace;border:1px solid #ddd}@media(max-width:500px){.notation-examples,.result-stats{grid-template-columns:repeat(2,1fr)}}.game-challenge{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:700px;margin:0 auto;min-height:100vh;background:#fff}.game-challenge h2{margin:0 0 10px;color:#333;font-size:1.8rem}.game-challenge h3{margin:0;color:#555}.game-challenge .description{color:#666;text-align:center;margin-bottom:30px;line-height:1.5}.difficulty-selection{width:100%;margin-bottom:30px}.difficulty-selection h3{text-align:center;margin-bottom:20px}.difficulty-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}.difficulty-card{display:flex;flex-direction:column;align-items:center;padding:20px;border:2px solid #ddd;border-radius:12px;background:#fff;cursor:pointer;transition:all .2s ease;text-align:center;position:relative}.difficulty-card:hover{transform:translateY(-3px);box-shadow:0 4px 15px #0000001a}.difficulty-card.beginner:hover{border-color:#4caf50}.difficulty-card.intermediate:hover{border-color:#2196f3}.difficulty-card.advanced:hover{border-color:#ff9800}.difficulty-card.expert:hover{border-color:#9c27b0}.difficulty-label{font-size:1.1rem;font-weight:600;color:#333;margin-bottom:8px}.difficulty-desc{font-size:.85rem;color:#888}.difficulty-badge{position:absolute;top:-8px;right:-8px;background:#9c27b0;color:#fff;padding:4px 10px;border-radius:12px;font-size:.75rem;font-weight:600}.mode-selection{width:100%;margin-bottom:30px}.mode-selection h3{text-align:center;margin-bottom:20px}.mode-buttons{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.mode-button{display:flex;flex-direction:column;align-items:center;padding:25px 35px;border:2px solid #ddd;border-radius:12px;background:#fff;cursor:pointer;transition:all .2s ease;min-width:180px}.mode-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.mode-button.practice:hover{border-color:#2196f3}.mode-button.challenge:hover{border-color:#ff9800}.mode-icon{font-size:2.5rem;margin-bottom:10px}.mode-name{font-size:1.2rem;font-weight:600;color:#333;margin-bottom:5px}.mode-desc{font-size:.85rem;color:#888}.game-list{display:flex;flex-direction:column;gap:12px;width:100%;max-width:500px;margin-bottom:30px}.game-card{display:flex;flex-direction:column;padding:16px 20px;border:2px solid #ddd;border-radius:10px;background:#fff;cursor:pointer;transition:all .2s ease;text-align:left}.game-card:hover{border-color:#4caf50;transform:translate(5px)}.game-card.random{flex-direction:row;align-items:center;gap:15px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff}.game-card.random:hover{transform:translate(5px);box-shadow:0 4px 15px #667eea66}.game-icon{font-size:2rem}.game-title{font-weight:600;color:#333;margin-bottom:4px}.game-card.random .game-title,.game-card.random .game-desc{color:#fff}.game-desc{font-size:.9rem;color:#666;margin-bottom:4px}.game-moves{font-size:.8rem;color:#999}.game-description{color:#666;text-align:center;margin-bottom:10px}.game-info{color:#888;font-size:.9rem;margin-bottom:20px}.expert-warning{background:#fff3e0;color:#e65100;padding:15px 20px;border-radius:10px;margin-bottom:20px;text-align:center;font-weight:500}.setting-group{margin-bottom:20px;text-align:center}.setting-group label{display:block;font-weight:600;color:#555;margin-bottom:12px}.perspective-options{display:flex;gap:10px;justify-content:center}.perspective-option{padding:12px 24px;border:2px solid #ddd;border-radius:8px;background:#fff;cursor:pointer;font-size:1rem;transition:all .2s ease}.perspective-option:hover{border-color:#4caf50}.perspective-option.selected{border-color:#4caf50;background:#4caf50;color:#fff}.challenge-note{text-align:center;color:#888;font-size:.9rem;margin-bottom:15px}.perspective-indicator{font-size:.95rem;color:#666;text-align:center;margin-bottom:10px}.action-buttons{display:flex;flex-direction:column;gap:12px;width:100%;max-width:300px}.start-button{padding:16px 40px;font-size:1.2rem;font-weight:600;background:#4caf50;color:#fff;border:none;border-radius:10px;cursor:pointer;transition:all .2s ease}.start-button:hover{background:#43a047;transform:translateY(-2px);box-shadow:0 4px 12px #4caf504d}.back-button{padding:12px 24px;font-size:1rem;background:transparent;color:#666;border:1px solid #ddd;border-radius:8px;cursor:pointer;transition:all .2s ease}.back-button:hover{background:#f5f5f5;border-color:#ccc}.game-challenge.playing{padding:15px;background:linear-gradient(180deg,#f5f5f5,#e8e8e8)}.game-header{width:100%;margin-bottom:15px}.game-info-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding:0 10px}.game-title-small{font-size:.95rem;color:#666;font-weight:500}.progress{font-size:1rem;color:#333;font-weight:600}.timer{font-size:1.3rem;font-weight:700;color:#4caf50;min-width:45px;text-align:center}.timer.warning{color:#f44336;animation:pulse-warning .5s ease infinite}@keyframes pulse-warning{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.notation-display{background:#1e3c72;border-radius:12px;padding:15px 20px;color:#fff}.move-indicator{font-size:1.1rem;margin-bottom:10px;opacity:.9}.moves-to-play{font-family:Georgia,serif}.limited-notation{display:flex;gap:15px;flex-wrap:wrap;justify-content:center}.upcoming-move{display:flex;gap:5px;align-items:center;font-size:1.4rem;opacity:.6}.upcoming-move.active{opacity:1;font-weight:700;font-size:1.8rem}.upcoming-move .move-number{color:#ffffffb3;font-size:.8em}.full-notation{display:flex;flex-wrap:wrap;gap:8px;max-height:150px;overflow-y:auto;padding:5px}.move-pair{display:inline-flex;gap:4px;font-size:.95rem;opacity:.5}.move-pair.current{opacity:1}.move-pair.played{opacity:.3}.move-pair .move-number{color:#fff9}.move-pair .move{padding:2px 4px;border-radius:3px}.move-pair .move.active{background:#fff3;font-weight:700}.game-board-container{margin-bottom:15px}.blindfold-mode{width:min(70vw,480px);height:min(70vw,480px);display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#2c3e50,#1a252f);border-radius:8px;color:#fff;text-align:center}.blindfold-icon{font-size:4rem;margin-bottom:15px}.blindfold-mode p{margin:5px 0;font-size:1.2rem}.blindfold-hint{opacity:.7;font-size:1rem!important}.peek-button{margin-top:20px;padding:12px 24px;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:8px;color:#fff;font-size:1rem;cursor:pointer;transition:all .2s ease}.peek-button:hover{background:#fff3;border-color:#ffffff80}.feedback{padding:12px 25px;border-radius:8px;font-size:1.1rem;font-weight:600;margin-bottom:15px;animation:slide-up .3s ease}@keyframes slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.feedback.correct{background:#e8f5e9;color:#2e7d32}.feedback.wrong,.feedback.timeout{background:#ffebee;color:#c62828}.game-controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.hint-button{padding:10px 20px;font-size:.95rem;background:#ff9800;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.hint-button:hover{background:#f57c00}.skip-button{padding:10px 20px;font-size:.95rem;background:#9e9e9e;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.skip-button:hover{background:#757575}.hide-button{padding:10px 20px;font-size:.95rem;background:#607d8b;color:#fff;border:none;border-radius:8px;cursor:pointer}.hide-button:hover{background:#546e7a}.quit-button{padding:10px 20px;font-size:.95rem;background:#f44336;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.quit-button:hover{background:#d32f2f}.game-title-result{color:#666;margin-bottom:20px}.results{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 20px #0000001a;width:100%;max-width:400px;margin-bottom:30px}.results.passed{border:3px solid #4CAF50}.results.failed{border:3px solid #FF9800}.result-main{display:flex;flex-direction:column;align-items:center;margin-bottom:25px}.result-icon{font-size:3rem;margin-bottom:10px}.result-accuracy{font-size:4rem;font-weight:700;color:#333;line-height:1}.result-label{font-size:1.1rem;color:#888;margin-top:5px}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.stat{display:flex;flex-direction:column;align-items:center;text-align:center}.stat-value{font-size:1.5rem;font-weight:600;color:#333}.stat-label{font-size:.8rem;color:#888}.result-message{text-align:center;font-size:1.1rem;color:#666;padding-top:15px;border-top:1px solid #eee}@media(max-width:500px){.result-stats{grid-template-columns:repeat(2,1fr)}}.app{min-height:100vh;background:#f5f5f5}*{box-sizing:border-box}button{font-family:inherit}.square-challenge,.notation-challenge{background:#fff;min-height:100vh}.square-challenge.playing,.notation-challenge.playing{background:linear-gradient(180deg,#f5f5f5,#e8e8e8)}