:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--gradient-primary: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);--gradient-cta: linear-gradient(135deg, #e09d33 0%, #b87a1f 100%);--color-primary: #f4a83e;--color-secondary: #d4922e;--color-text-muted: #888;--color-text-light: #aaa;--color-border: rgba(255, 255, 255, .1);--bg-panel: rgba(255, 255, 255, .25);--bg-panel-dark: rgba(255, 255, 255, .15);--bg-hover: rgba(255, 255, 255, .1);--bg-card: rgba(255, 255, 255, .05);--bg-dark: rgba(60, 60, 60, .7);--shadow-primary: 0 5px 15px rgba(244, 168, 62, .4);--shadow-board: 0 10px 40px rgba(244, 168, 62, .3);--transition-standard: all .2s ease;--transition-transform: transform .2s ease, box-shadow .2s ease;--border-radius: 6px;--border-radius-lg: 12px}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{width:100%;margin:0 auto;text-align:center}.App{max-width:1280px;margin:0 auto;padding:1rem}.home-page{min-height:100vh;padding:2rem}.header{margin-bottom:3rem}.header h1{font-size:3rem;margin-bottom:.5rem;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tagline{font-size:1.2rem;color:var(--color-text-muted)}.version{font-size:.9rem;color:var(--color-text-muted);margin-top:.5rem;opacity:.7}.main-content{max-width:1000px;margin:0 auto}.welcome-section{margin-bottom:3rem}.welcome-section h2{font-size:2rem;margin-bottom:1rem}.welcome-section p{font-size:1.1rem;color:var(--color-text-light)}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:3rem}.feature-card{background:var(--bg-card);padding:2rem;border-radius:var(--border-radius-lg);border:1px solid var(--color-border);transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.feature-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #f4a83e4d}.feature-card h3{font-size:1.5rem;margin-bottom:.5rem}.feature-card p{color:var(--color-text-light)}.cta-button{background:var(--gradient-cta);color:#fff;border:none;padding:1rem 2.5rem;font-size:1.1rem;border-radius:8px;cursor:pointer;transition:var(--transition-transform);font-weight:600}.cta-button:hover{transform:scale(1.05);box-shadow:var(--shadow-primary)}.cta-button:active{transform:scale(.98)}.analyze-games{min-height:90vh;padding:.1rem}.analyze-header{display:flex;justify-content:center;align-items:center;gap:2rem;margin-bottom:2rem;position:relative}.back-button{position:absolute;left:0;top:0;background:var(--bg-hover);color:#fff;border:1px solid var(--color-border);padding:.5rem 1rem;border-radius:var(--border-radius);cursor:pointer;font-size:1rem;transition:var(--transition-standard)}.back-button:hover{background:#fff3;transform:translate(-3px)}.analyze-header h1{font-size:2.5rem;margin:0;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.analyze-header h3{font-size:1.5rem;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{color:var(--color-text-muted);font-size:1.1rem}.analyze-content{display:flex;gap:2rem;max-width:1400px;margin:0 auto;justify-content:center;align-items:flex-start}.chess-board-container{display:flex;flex-direction:column;align-items:center}.board-with-captures{display:flex;flex-direction:row;align-items:center;gap:1rem}.captured-pieces-container{display:flex;flex-direction:column;gap:1rem;height:640px}.captured-pieces{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-width:60px;padding:.5rem;background:var(--bg-panel-dark);border-radius:var(--border-radius);border:1px solid var(--color-border);flex:1}.captured-icons{display:flex;flex-direction:column;gap:.25rem;align-items:center}.captured-piece-icon{width:32px;height:32px;object-fit:contain}.chess-board{display:grid;grid-template-columns:repeat(8,80px);grid-template-rows:repeat(8,80px);border:3px solid var(--color-secondary);box-shadow:var(--shadow-board);border-radius:4px;overflow:hidden;background-size:cover;background-position:center}.chess-square{display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease;background-color:transparent;position:relative}.chess-square.selected{background-color:#ffff0080!important;box-shadow:inset 0 0 10px #ff0c}.chess-square.in-check{background-color:#ff000080!important;animation:flashRed 1s ease-in-out infinite;box-shadow:inset 0 0 20px #ff0000e6,0 0 20px #ff000080}@keyframes flashRed{0%,to{box-shadow:inset 0 0 #f000;background-color:transparent}25%{box-shadow:inset 0 0 20px #f00c;background-color:#ff00004d}50%{box-shadow:inset 0 0 30px red;background-color:#ff000080}75%{box-shadow:inset 0 0 20px #f00c;background-color:#ff00004d}}.chess-square.valid-move:after{content:"";position:absolute;width:30%;height:30%;background-color:#87cefab3;border-radius:50%;pointer-events:none}.chess-square.valid-move-attacked:after{content:"";position:absolute;width:30%;height:30%;background-color:#ffc882d9;border-radius:50%;pointer-events:none;box-shadow:0 0 10px #ffb464b3}.chess-square.valid-attack:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;height:90%;background-color:#ff00004d;border:3px solid rgba(255,0,0,.8);border-radius:50%;box-sizing:border-box;pointer-events:none}.chess-square.valid-attack-safe:before{content:"";position:absolute;top:10%;right:10%;width:20%;height:20%;background-color:#87cefae6;border:1px solid rgb(59,130,173);border-radius:50%;pointer-events:none;box-shadow:0 0 8px #6496ffb3;z-index:3}.chess-square.valid-attack-unsafe:before{content:"";position:absolute;top:10%;right:10%;width:20%;height:20%;background-color:#ffc88280;border:1px solid rgba(255,200,130);border-radius:50%;pointer-events:none;box-shadow:0 0 10px #ffb464b3;z-index:3}.chess-square.under-attack{animation:pulse-attack 1.5s ease-in-out}.chess-square.under-attack-black{background-color:#ff8c0080!important}.chess-square.under-attack-white{background-color:#228b2280!important}@keyframes pulse-attack{0%,to{box-shadow:inset 0 0 10px #ff8c00cc}50%{box-shadow:inset 0 0 20px #ff8c00}}.chess-square.protected{box-sizing:border-box}.chess-square.protected-white-1{border:3px solid rgba(0,100,200,.7);box-shadow:inset 0 0 5px #0064c866}.chess-square.protected-white-2{border:4px solid rgba(0,100,200,.8);box-shadow:inset 0 0 8px #0064c880}.chess-square.protected-white-3{border:5px solid rgba(0,100,200,.9);box-shadow:inset 0 0 12px #0064c899}.chess-square.protected-white-4{border:6px solid rgba(0,100,200,1);box-shadow:inset 0 0 15px #0064c8b3}.chess-square.protected-black-1{border:3px solid rgba(60,60,60,.8);box-shadow:inset 0 0 5px #3c3c3c80}.chess-square.protected-black-2{border:4px solid rgba(60,60,60,.85);box-shadow:inset 0 0 8px #3c3c3c99}.chess-square.protected-black-3{border:5px solid rgba(60,60,60,.9);box-shadow:inset 0 0 12px #3c3c3cb3}.chess-square.protected-black-4{border:6px solid rgba(60,60,60,1);box-shadow:inset 0 0 15px #3c3c3ccc}.chess-square:hover{opacity:.8}.chess-piece{font-size:4.8rem;-webkit-user-select:none;user-select:none}.chess-piece-img{width:90%;height:90%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:auto;cursor:grab}.chess-piece-img:active{cursor:grabbing}.turn-indicator{font-size:1.2rem;font-weight:600;color:#fff;padding:.5rem 1rem;background:var(--bg-panel-dark);border-radius:8px;border:1px solid var(--color-primary);white-space:nowrap}.analysis-panel,.move-history-panel{padding:10px 2rem;border-radius:var(--border-radius-lg);border:1px solid var(--color-border);min-width:300px;max-width:400px;height:90vh;display:flex;flex-direction:column}.move-history-panel{min-width:450px;max-width:600px;background:var(--bg-panel-dark)}.analysis-panel{background:var(--bg-panel);overflow-y:auto}.analysis-panel h3{margin-bottom:1.5rem;font-size:1.5rem}.tool-buttons{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.button-row{display:flex;gap:.5rem}.button-row .tool-btn{flex:1}.tool-btn,.export-btn,.import-btn{background:var(--gradient-primary);color:#d84315;border:none;border-radius:var(--border-radius);cursor:pointer;font-weight:500;transition:var(--transition-transform)}.tool-btn:hover:not(:disabled),.export-btn:hover:not(:disabled),.import-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-primary)}.tool-btn:active:not(:disabled),.export-btn:active:not(:disabled),.import-btn:active{transform:translateY(0)}.tool-btn{padding:.8rem 1.5rem;font-size:1rem}.export-btn,.import-btn{padding:.5rem 1rem;font-size:.9rem;transition:var(--transition-transform),opacity .2s ease}.export-btn:disabled{opacity:.5;cursor:not-allowed}.move-history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.move-history-panel h3{margin:0;font-size:1.5rem;padding-bottom:1rem}.history-buttons{display:flex;gap:.5rem}.placeholder{color:var(--color-text-muted);font-style:italic;text-align:center;padding:1rem}.attack-toggles{border-top:1px solid var(--color-border);padding:1rem 0;margin-bottom:.5rem}.attack-toggles h4{margin-bottom:1rem;font-size:1.2rem}.toggle-btn{width:100%;background:var(--bg-dark);color:#f0f0f0;border:1px solid rgba(255,255,255,.2);padding:.8rem 1rem;border-radius:var(--border-radius);cursor:pointer;font-size:.95rem;font-weight:500;transition:var(--transition-standard);margin-bottom:.5rem;display:flex;justify-content:space-between;align-items:center}.toggle-content{display:flex;align-items:center;gap:.5rem}.toggle-icon{font-size:1.1em}.toggle-btn:hover{background:var(--bg-hover);transform:translateY(-1px)}.toggle-btn.active{background:var(--gradient-primary);border-color:var(--color-secondary);box-shadow:0 3px 10px #f4a83e4d;color:#d84315}.status-light{display:inline-block;font-size:1.2em;margin-left:.5rem;transition:all .3s ease}.status-light.on{color:#0f0;text-shadow:0 0 8px rgba(0,255,0,.8);animation:pulse-green 2s infinite}.status-light.off{color:red;text-shadow:0 0 8px rgba(255,0,0,.5);opacity:.7}@keyframes pulse-green{0%,to{text-shadow:0 0 8px rgba(0,255,0,.8)}50%{text-shadow:0 0 15px rgba(0,255,0,1)}}@media(min-width:2560px){.chess-board{grid-template-columns:repeat(8,105px);grid-template-rows:repeat(8,105px)}.captured-pieces-container{height:840px}.analysis-panel,.move-history-panel{height:75vh}}@media(min-width:1400px)and (max-width:1990px){.chess-board{grid-template-columns:repeat(8,85px);grid-template-rows:repeat(8,85px)}.captured-pieces-container{height:680px}.analysis-panel,.move-history-panel{height:85vh}}@media(max-width:1399px){.chess-board{grid-template-columns:repeat(8,80px);grid-template-rows:repeat(8,80px)}.chess-piece{font-size:3.6rem}}@media(max-width:1200px){.analysis-panel,.move-history-panel{height:75vh}}@media(max-width:768px){.chess-board{grid-template-columns:repeat(8,56px);grid-template-rows:repeat(8,56px)}.captured-pieces-container{height:448px}.chess-piece{font-size:2.4rem}.analyze-content{flex-direction:column;align-items:center}}@media(max-width:480px){.chess-board{grid-template-columns:repeat(8,36px);grid-template-rows:repeat(8,36px)}.captured-pieces-container{height:288px}.chess-piece{font-size:1.6rem}}.moves-container{flex:1;overflow-y:auto;padding:10px;border:1px solid #ccc;border-radius:4px;background-color:#f9f9f9}.move-history-header-row{display:grid;grid-template-columns:40px 1fr 1fr;gap:4px;padding:8px 4px;background-color:var(--bg-dark);border-radius:4px;margin-bottom:8px;font-weight:700;color:#f0f0f0;position:sticky;top:0;z-index:10}.move-number-col{text-align:left;padding-left:8px;font-size:.9em}.white-moves-col,.black-moves-col{text-align:left;font-size:.9em}.move-row{display:grid;grid-template-columns:40px 1fr 1fr;gap:4px;margin-bottom:4px;align-items:center}.move-row .move-number{text-align:center;font-weight:700;color:#666;font-size:.9em;padding:8px 4px}.move-cell{padding:8px 12px;border-radius:4px;background-color:#fff;border-left:4px solid #ddd;transition:all .2s;cursor:pointer;text-align:left;font-family:monospace;font-size:.95em;color:#333;min-height:36px;display:flex;align-items:center}.move-cell.empty{background-color:transparent;border:none;cursor:default}.move-cell.white-move{border-left-color:#87ceeb}.move-cell.black-move{border-left-color:#666}.move-cell:not(.empty):hover{background-color:#f0f0f0;transform:translate(2px)}.move-cell.active{background-color:#e3f2fd;border-left-width:4px;box-shadow:0 2px 8px #f4a83e4d}.move-cell.white-move.active,.move-cell.black-move.active{border-left-color:var(--color-primary)}.move-cell.sealed{opacity:.6;cursor:not-allowed;background-color:#f5f5f5}.move-cell.sealed:hover{background-color:#f5f5f5;transform:none}.move-row.checkmate-row{grid-template-columns:40px 1fr}.move-cell.checkmate-cell{grid-column:2 / 4;background:linear-gradient(135deg,#ff6b6b,#ee5a6f);color:#1a1a1a;font-weight:700;border:none;text-align:center;justify-content:center;box-shadow:0 3px 10px #ff6b6b66}.move-cell.checkmate-cell:hover{transform:scale(1.02)}.move-number{font-weight:700;color:#666;margin-right:8px;font-size:.9em}.defender-flash-white{animation:defenderPulseWhite .5s ease-in-out 2}.defender-flash-black{animation:defenderPulseBlack .5s ease-in-out 2}.attacked-flash-white{animation:attackedPulseWhite .5s ease-in-out 2}.attacked-flash-black{animation:attackedPulseBlack .5s ease-in-out 2}@keyframes defenderPulseWhite{0%,to{box-shadow:inset 0 0 #87cefa00;background-color:transparent}25%{box-shadow:inset 0 0 20px #87cefacc;background-color:#87cefa4d}50%{box-shadow:inset 0 0 30px #87cefa;background-color:#87cefa80}75%{box-shadow:inset 0 0 20px #87cefacc;background-color:#87cefa4d}}@keyframes defenderPulseBlack{0%,to{box-shadow:inset 0 0 #6a6a6a00;background-color:transparent}25%{box-shadow:inset 0 0 20px #6a6a6acc;background-color:#6a6a6a4d}50%{box-shadow:inset 0 0 30px #6a6a6a;background-color:#6a6a6a80}75%{box-shadow:inset 0 0 20px #6a6a6acc;background-color:#6a6a6a4d}}@keyframes attackedPulseWhite{0%,to{box-shadow:inset 0 0 #ff646400;background-color:transparent}25%{box-shadow:inset 0 0 20px #ff6464cc;background-color:#ff64644d}50%{box-shadow:inset 0 0 30px #ff6464;background-color:#ff646480}75%{box-shadow:inset 0 0 20px #ff6464cc;background-color:#ff64644d}}@keyframes attackedPulseBlack{0%,to{box-shadow:inset 0 0 #c8323200;background-color:transparent}25%{box-shadow:inset 0 0 20px #c83232cc;background-color:#c832324d}50%{box-shadow:inset 0 0 30px #c83232;background-color:#c8323280}75%{box-shadow:inset 0 0 20px #c83232cc;background-color:#c832324d}}.color-selection-overlay{position:fixed;inset:0;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.color-selection-modal{background:linear-gradient(135deg,#2a2a2a,#1a1a1a);border:2px solid var(--color-border);border-radius:20px;padding:3rem;max-width:500px;text-align:center;box-shadow:0 10px 50px #00000080;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.color-selection-modal h2{font-size:2rem;margin:0 0 1rem;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.color-selection-modal p{color:#aaa;margin-bottom:2rem;font-size:1.1rem}.color-buttons{display:flex;gap:1.5rem;justify-content:center}.color-btn{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem 2.5rem;border:2px solid var(--color-border);border-radius:var(--border-radius);background:var(--bg-hover);cursor:pointer;transition:all .3s ease;font-size:1rem;color:#fff}.color-btn:hover{transform:translateY(-5px);box-shadow:0 10px 30px #0000004d}.color-btn.white-btn:hover{border-color:#fff;background:linear-gradient(135deg,#ffffff1a,#ffffff0d)}.color-btn.black-btn:hover{border-color:#888;background:linear-gradient(135deg,#0000004d,#0003)}.color-icon{font-size:4rem}.color-label{font-size:1.2rem;font-weight:600}
