.theme-toggle{position:fixed;top:2rem;right:2rem;width:50px;height:50px;background:var(--pixel-surface);border:3px solid var(--pixel-border);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.5rem;transition:all .2s;box-shadow:4px 4px 0 var(--pixel-shadow);z-index:1000}.theme-toggle:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--pixel-shadow);border-color:var(--pixel-primary)}.theme-toggle:active{transform:translate(4px,4px);box-shadow:none}.header{text-align:center;margin-bottom:2rem;padding:1.5rem;background:var(--pixel-surface);border:4px solid var(--pixel-border);box-shadow:8px 8px 0 var(--pixel-shadow);position:relative;animation:fadeIn .6s ease-out}.header:before{content:"";position:absolute;inset:-4px;background:linear-gradient(45deg,var(--pixel-accent),var(--pixel-success));z-index:-1;opacity:.15}h1{font-family:"Press Start 2P",monospace;font-size:1.5rem;color:var(--pixel-primary);text-shadow:3px 3px 0 var(--pixel-shadow);margin-bottom:.5rem;letter-spacing:2px}.subtitle{font-size:.9rem;color:var(--pixel-text-dim);font-weight:400}.pixel-corner{position:absolute;width:12px;height:12px;border:3px solid var(--pixel-primary)}.pixel-corner.top-left{top:-6px;left:-6px;border-right:none;border-bottom:none}.pixel-corner.top-right{top:-6px;right:-6px;border-left:none;border-bottom:none}.pixel-corner.bottom-left{bottom:-6px;left:-6px;border-right:none;border-top:none}.pixel-corner.bottom-right{bottom:-6px;right:-6px;border-left:none;border-top:none}@media(max-width:768px){h1{font-size:1rem}}.pomodoro-section{background:var(--pixel-surface);border:4px solid var(--pixel-border);padding:2rem;box-shadow:8px 8px 0 var(--pixel-shadow)}.section-title{font-family:"Press Start 2P",monospace;font-size:1rem;color:var(--pixel-secondary);margin-bottom:1.5rem;text-transform:uppercase;letter-spacing:1px}.timer-mode-switch{display:flex;gap:0;justify-content:center;margin-bottom:1.5rem;border:3px solid var(--pixel-border);background:var(--pixel-bg);overflow:hidden}.timer-mode-btn{flex:1;padding:.75rem 1rem;border:none;background:transparent;color:var(--pixel-text-dim);font-family:Pixelify Sans,sans-serif;font-weight:600;font-size:.75rem;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.5px}.timer-mode-btn.active{background:var(--pixel-primary);color:var(--pixel-bg)}.timer-mode-btn:not(.active):hover{background:var(--pixel-surface);color:var(--pixel-text)}.timer-mode-btn+.timer-mode-btn{border-left:2px solid var(--pixel-border)}.mode-selector{display:flex;gap:.5rem;justify-content:center;margin-bottom:1.5rem}.mode-btn{padding:.5rem 1rem;border:2px solid var(--pixel-border);background:var(--pixel-bg);color:var(--pixel-text-dim);font-family:Pixelify Sans,sans-serif;font-size:.75rem;cursor:pointer;transition:all .2s}.mode-btn.active{background:var(--pixel-primary);color:var(--pixel-bg);border-color:var(--pixel-primary);font-weight:700}.timer-display{text-align:center;margin:2rem 0}.timer-label{font-size:.75rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:1rem}.timer{font-family:"Press Start 2P",monospace;font-size:3.5rem;color:var(--pixel-primary);text-shadow:4px 4px 0 var(--pixel-shadow);margin:1rem 0;letter-spacing:4px}.timer.active{animation:pulse 2s ease-in-out infinite}.progress-bar{height:12px;background:var(--pixel-border);border:2px solid var(--pixel-text-dim);position:relative;overflow:hidden;margin:1.5rem 0}.progress-fill{height:100%;background:linear-gradient(90deg,var(--pixel-accent),var(--pixel-success));transition:width 1s linear;position:relative;box-shadow:inset 0 0 10px #a2e2cd66}.progress-fill:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 4px,rgba(255,255,255,.1) 4px,rgba(255,255,255,.1) 8px)}.session-info{text-align:center;margin-top:1rem;font-size:.8rem;color:var(--pixel-text-dim);padding:.75rem;background:var(--pixel-bg);border:2px solid var(--pixel-border)}.session-info span{color:var(--pixel-accent);font-weight:700;font-size:1.1em}.controls{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.btn{font-family:Pixelify Sans,sans-serif;font-weight:700;padding:.75rem 1.5rem;border:3px solid;background:var(--pixel-surface);color:var(--pixel-text);cursor:pointer;font-size:.9rem;text-transform:uppercase;letter-spacing:1px;transition:all .1s;box-shadow:4px 4px 0 var(--pixel-shadow)}.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--pixel-shadow)}.btn:active{transform:translate(4px,4px);box-shadow:none}.btn-primary{border-color:var(--pixel-primary);color:var(--pixel-primary)}.btn-secondary{border-color:var(--pixel-secondary);color:var(--pixel-secondary)}.btn-accent{border-color:var(--pixel-accent);color:var(--pixel-accent)}.btn-success{border-color:var(--pixel-success);color:var(--pixel-success)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}.stat-box{text-align:center;padding:1rem;background:var(--pixel-bg);border:2px solid var(--pixel-border)}.stat-value{font-family:"Press Start 2P",monospace;font-size:1.5rem;color:var(--pixel-accent);margin-bottom:.5rem}.stat-label{font-size:.7rem;color:var(--pixel-text-dim);text-transform:uppercase}.stopwatch-display{text-align:center;margin:2rem 0}.stopwatch-time{font-family:"Press Start 2P",monospace;font-size:3rem;color:var(--pixel-accent);text-shadow:4px 4px 0 var(--pixel-shadow);margin:1rem 0;letter-spacing:3px}.stopwatch-time.running{animation:pulse 2s ease-in-out infinite}.lap-list{max-height:150px;overflow-y:auto;margin-top:1rem;padding:.5rem;background:var(--pixel-bg);border:2px solid var(--pixel-border)}.lap-item{display:flex;justify-content:space-between;padding:.5rem;border-bottom:1px solid var(--pixel-border);font-size:.8rem;color:var(--pixel-text-dim)}.lap-item:last-child{border-bottom:none}.lap-number{color:var(--pixel-primary);font-weight:600}@media(max-width:768px){.timer{font-size:2.5rem}.stopwatch-time{font-size:2rem}.controls{flex-direction:column}.btn{width:100%}}.todo-section{background:var(--pixel-surface);border:4px solid var(--pixel-border);padding:2rem;box-shadow:8px 8px 0 var(--pixel-shadow)}.todo-input{width:100%;margin-bottom:1rem}.input-field{width:100%;padding:.75rem;background:var(--pixel-bg);border:3px solid var(--pixel-border);color:var(--pixel-text);font-family:Pixelify Sans,sans-serif;font-size:.9rem;transition:border-color .2s}.input-field:focus{outline:none;border-color:var(--pixel-primary);box-shadow:inset 0 0 0 1px var(--pixel-primary)}.input-field::placeholder{color:var(--pixel-text-dim)}textarea.input-field{resize:vertical;min-height:80px;font-family:Pixelify Sans,sans-serif}.add-todo-btn{width:100%;margin-top:1rem}.helper-text{text-align:center;font-size:.85rem;color:var(--pixel-text-dim);padding:.75rem;background:var(--pixel-bg);border:2px solid var(--pixel-border);border-left:4px solid var(--pixel-accent)}.helper-text strong{color:var(--pixel-accent);font-weight:700;font-size:1.1em}.todo-list{display:flex;flex-direction:column;gap:.75rem;max-height:400px;overflow-y:auto;padding-right:.5rem}.todo-item{background:var(--pixel-bg);border:2px solid var(--pixel-border);padding:1rem;display:flex;gap:1rem;align-items:flex-start;transition:all .2s;position:relative}.todo-item:hover{border-color:var(--pixel-primary);transform:translate(4px)}.todo-item.completed{opacity:.5}.todo-item.completed .todo-title{text-decoration:line-through}.todo-item.active{border:3px solid var(--pixel-accent);background:linear-gradient(90deg,var(--pixel-bg) 0%,rgba(60,162,166,.1) 100%);box-shadow:0 0 15px #3ca2a64d}.todo-item.active:before{content:"▶";position:absolute;left:-12px;top:50%;transform:translateY(-50%);color:var(--pixel-accent);font-size:1.2rem;animation:pulse 2s ease-in-out infinite}.todo-item.active .todo-title{color:var(--pixel-accent);font-weight:700}.checkbox{width:20px;height:20px;min-width:20px;border:3px solid var(--pixel-border);background:var(--pixel-surface);cursor:pointer;position:relative;margin-top:2px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.checkbox.checked{background:var(--pixel-success);border-color:var(--pixel-success);color:var(--pixel-bg)}.todo-content{flex:1}.todo-title{font-weight:600;font-size:1rem;margin-bottom:.25rem;color:var(--pixel-text)}.todo-description{font-size:.85rem;color:var(--pixel-text-dim);line-height:1.4}.todo-actions{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end}.todo-time{font-family:"Press Start 2P",monospace;font-size:.6rem;color:var(--pixel-accent);white-space:nowrap}.action-buttons{display:flex;gap:.5rem}.icon-btn{width:24px;height:24px;min-width:24px;border:2px solid var(--pixel-border);background:var(--pixel-surface);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.75rem;transition:all .2s;color:var(--pixel-text-dim)}.icon-btn:hover{border-color:var(--pixel-primary);color:var(--pixel-primary);transform:scale(1.1)}.icon-btn.delete:hover{border-color:var(--pixel-secondary);color:var(--pixel-secondary)}.icon-btn.play{background:var(--pixel-bg)}.icon-btn.play:hover{border-color:var(--pixel-accent);color:var(--pixel-accent)}.icon-btn.play.active{background:var(--pixel-accent);color:var(--pixel-bg);border-color:var(--pixel-accent);animation:pulse 2s ease-in-out infinite}.edit-modal{display:none;position:fixed;inset:0;background:#000000d9;z-index:2000;align-items:center;justify-content:center;padding:2rem}.edit-modal.active{display:flex;animation:fadeIn .3s ease-out}.modal-content{background:var(--pixel-surface);border:4px solid var(--pixel-border);padding:2rem;max-width:500px;width:100%;box-shadow:12px 12px 0 var(--pixel-shadow);position:relative;animation:slideUp .3s ease-out}.modal-title{font-family:"Press Start 2P",monospace;font-size:.9rem;color:var(--pixel-primary);margin-bottom:1.5rem;text-transform:uppercase}.modal-label{font-size:.8rem;color:var(--pixel-text-dim);margin-bottom:.5rem;display:block;text-transform:uppercase;letter-spacing:1px}.modal-buttons{display:flex;gap:1rem;margin-top:1.5rem}.modal-buttons .btn{flex:1}.time-input-group{display:flex;gap:.5rem;align-items:center;margin-bottom:1rem}.time-input{width:80px;padding:.75rem;background:var(--pixel-bg);border:3px solid var(--pixel-border);color:var(--pixel-text);font-family:"Press Start 2P",monospace;font-size:.9rem;text-align:center}.time-input:focus{outline:none;border-color:var(--pixel-primary)}.time-separator{font-family:"Press Start 2P",monospace;font-size:1.2rem;color:var(--pixel-text-dim)}.add-todo-btn{width:100%;margin-top:0;margin-bottom:0}.todo-section .section-title{margin-bottom:1.5rem}.container{max-width:900px;width:100%;animation:fadeIn .6s ease-out}.main-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:2rem}@media(max-width:768px){.main-grid{grid-template-columns:1fr}}:root{--pixel-bg: #1a1a14;--pixel-surface: #324028;--pixel-border: #4a5538;--pixel-primary: #CCC675;--pixel-secondary: #7A712E;--pixel-accent: #3CA2A6;--pixel-success: #A2E2CD;--pixel-text: #D4FAD1;--pixel-text-dim: #94b88a;--pixel-shadow: rgba(0, 0, 0, .5);--grid-opacity: .03}[data-theme=light]{--pixel-bg: #f5f8f0;--pixel-surface: #ffffff;--pixel-border: #b8c9a8;--pixel-primary: #7A712E;--pixel-secondary: #324028;--pixel-accent: #3CA2A6;--pixel-success: #5a8f7a;--pixel-text: #324028;--pixel-text-dim: #7A712E;--pixel-shadow: rgba(50, 64, 40, .15);--grid-opacity: .06}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Pixelify Sans,sans-serif;background:var(--pixel-bg);color:var(--pixel-text);min-height:100vh;background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(204,198,117,var(--grid-opacity)) 2px,rgba(204,198,117,var(--grid-opacity)) 4px),repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(204,198,117,var(--grid-opacity)) 2px,rgba(204,198,117,var(--grid-opacity)) 4px);transition:background-color .3s ease,color .3s ease}#root{display:flex;justify-content:center;padding:2rem;min-height:100vh}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--pixel-bg);border:2px solid var(--pixel-border)}::-webkit-scrollbar-thumb{background:var(--pixel-primary);border:2px solid var(--pixel-border)}