:root{font-family: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}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.header{width:93vw;background:linear-gradient(135deg,#667eea,#764ba2);padding:1rem 0;box-shadow:0 2px 10px #0000001a;position:sticky;top:0;z-index:1000}.header-container{width:86vw;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center;border-radius:50%}.logo-section{display:flex;align-items:center;gap:1.5rem}.logo{height:3rem;width:auto;will-change:filter;transition:transform .3s ease;padding:.3em}.logo:hover{transform:scale(1.1)}.logo.vite:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react{animation:spin 20s linear infinite}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}.logo.graphql:hover{filter:drop-shadow(0 0 2em color(display-p3 .8824 0 .5961))}.nav-section{display:flex;align-items:center}.nav-list{display:flex;list-style:none;margin:0;padding:0;gap:2rem}.nav-list li a{color:#fff;text-decoration:none;font-weight:500;font-size:1rem;transition:all .3s ease;padding:.5rem 1rem;border-radius:6px}.nav-list li a:hover{background:#ffffff1a;transform:translateY(-1px)}.nav-button{background:none;border:none;color:#fff;font-size:1rem;font-weight:500;font-family:inherit;cursor:pointer;padding:.5rem 1rem;border-radius:6px;transition:all .3s ease;text-decoration:none}.nav-button:hover{background-color:#ffffff1a;transform:translateY(-1px)}.nav-button.active{background-color:#fff3;font-weight:700;box-shadow:0 2px 4px #0000001a}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.header-container{flex-direction:column;gap:1rem}.logo-section,.nav-list{gap:1rem}.logo{height:2rem}}.about-page{min-height:100vh;margin-top:1rem}.about-container{max-width:1200px;margin:0 auto;padding:2rem;background:#ffffff0d;border-radius:12px;box-shadow:0 8px 32px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.about-title{text-align:center;color:#fff;font-size:2.5rem;margin-bottom:2rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.5)}.about-content{display:flex;flex-direction:column;gap:2rem}.about-text h2{color:#fff;font-size:2rem;margin-bottom:.5rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.about-text h3{color:#e0e0e0;font-size:1.5rem;margin-bottom:1rem;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.3)}.about-text p{color:#ccc;line-height:1.6;margin-bottom:1.5rem;font-size:1.1rem}.skills-section{margin:2rem 0}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:1.5rem}.skill-category{background:#ffffff1a;padding:1.5rem;border-radius:8px;border-left:4px solid #4a9eff;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1)}.skill-category h4{color:#fff;font-size:1.2rem;margin-bottom:1rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.skill-category ul{list-style:none;padding:0}.skill-category li{color:#e0e0e0;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:1rem}.skill-category li:last-child{border-bottom:none}.experience-section,.contact-section{margin:2rem 0;padding:1.5rem;background:#ffffff1a;border-radius:8px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1)}.contact-section{background:#4a9eff1a;border-left:4px solid #4a9eff}.experience-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;justify-content:space-evenly}.experience-item{display:flex;flex-direction:column;padding:1.5rem;padding-bottom:.5em;padding-top:.5em;border-radius:8px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1)}.experience-item h4{color:#e0e0e0;font-size:1.2rem;margin-bottom:.5rem;margin-top:.7rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.experience-item ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:space-evenly}.experience-item li{color:#e0e0e0;padding:.5rem 2rem;background:#ffffff0d;border-radius:20px;font-size:.9rem;white-space:nowrap;border:1px solid rgba(255,255,255,.1)}.experience-description li{padding:.3em;border-radius:4px;list-style:none;white-space:normal;word-wrap:normal}@media (max-width: 768px){.about-page,.about-container{padding:1rem}.about-title{font-size:2rem}.skills-grid{grid-template-columns:1fr;gap:1rem}.about-text h2{font-size:1.5rem}.about-text h3{font-size:1.2rem}}.projects-page{min-height:100vh;margin-top:1rem}.projects-container{max-width:1200px;margin:0 auto;padding:2rem;background:#ffffff0d;border-radius:12px;box-shadow:0 8px 32px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.projects-container-2{margin-top:2rem}.projects-title{text-align:center;color:#fff;font-size:2.5rem;margin-bottom:1rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.5)}.projects-intro{text-align:center;margin-bottom:3rem}.projects-intro p{color:#ccc;font-size:1.1rem;line-height:1.6;max-width:800px;margin:0 auto}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-top:2rem}.project-card{background:#ffffff1a;border-radius:12px;overflow:hidden;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1);transition:all .3s ease;height:100%;display:flex;flex-direction:column}.project-card:hover{transform:translateY(-5px);box-shadow:0 12px 24px #0006;border-color:#4a9eff4d}.project-image{height:200px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;position:relative}.project-placeholder{color:#fff;font-size:1.2rem;font-weight:600;text-align:center;padding:1rem;text-shadow:0 2px 4px rgba(0,0,0,.3)}.project-content{padding:1.5rem;flex:1;display:flex;flex-direction:column}.project-title{color:#fff;font-size:1.4rem;margin-bottom:1rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.project-description{color:#ccc;line-height:1.6;margin-bottom:1.5rem;flex:1}.project-technologies{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.tech-tag{background:#4a9eff33;color:#4a9eff;padding:.3rem .8rem;border-radius:15px;font-size:.8rem;font-weight:500;border:1px solid rgba(74,158,255,.3);white-space:nowrap}.project-links{display:flex;gap:1rem;margin-top:auto}.project-link{padding:.6rem 1.2rem;border-radius:6px;text-decoration:none;font-weight:500;font-size:.9rem;transition:all .3s ease;text-align:center;flex:1}.github-link{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2)}.github-link:hover{background:#fff3;transform:translateY(-2px)}.live-link{background:#4a9eff33;color:#4a9eff;border:1px solid rgba(74,158,255,.3)}.live-link:hover{background:#4a9eff4d;transform:translateY(-2px)}.odin-project-section-title{color:#fff;font-size:3rem;margin-bottom:1rem;text-align:center;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.5)}.section-description{color:#ccc;text-align:center;margin-bottom:1rem;font-size:1.1rem;line-height:1.6}.section-description-2{color:#ccc;text-align:center;margin-bottom:3rem;font-size:.9rem;line-height:1.6}.odin-project-container{display:flex;gap:2rem;min-height:500px}.odin-nav{width:250px;background:#ffffff0d;border-radius:12px;padding:1.5rem;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1);height:fit-content}.odin-nav h3{color:#fff;font-size:1.2rem;margin-bottom:1.5rem;text-align:center;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.odin-nav-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}.odin-nav-button{width:100%;padding:.8rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#ccc;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;text-align:left}.odin-nav-button:hover{background:#ffffff1a;color:#fff;transform:translate(5px)}.odin-nav-button.active{background:#4a9eff33;color:#4a9eff;border-color:#4a9eff4d;font-weight:600}.odin-content{flex:1;background:#ffffff0d;border-radius:12px;padding:2rem;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1)}.odin-project-title{color:#fff;font-size:1.8rem;margin-bottom:1rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.odin-project-description{color:#ccc;line-height:1.6;margin-bottom:2rem;font-size:1.1rem}.odin-project-technologies{margin-bottom:2rem}.odin-project-technologies h4{color:#fff;font-size:1.2rem;margin-bottom:1rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem}.features-list{list-style:none;padding:0;margin:0}.features-list li{color:#e0e0e0;border-bottom:1px solid rgba(255,255,255,.1);font-size:1rem;position:relative;padding:.5rem 0 .5rem 1.5rem}.features-list li:before{content:"•";color:#4a9eff;font-weight:700;position:absolute;left:0}.features-list li:last-child{border-bottom:none}@media (max-width: 768px){.projects-page,.projects-container{padding:1rem}.projects-title{font-size:2rem}.projects-grid{grid-template-columns:1fr;gap:1.5rem}.project-card{min-height:400px}.project-links{flex-direction:column}.project-link{width:100%}.odin-project-container{flex-direction:column;gap:1.5rem}.odin-nav{width:100%}.odin-nav-list{flex-direction:row;flex-wrap:wrap;gap:.5rem}.odin-nav-button{width:auto;min-width:120px}}@media (max-width: 480px){.projects-grid{grid-template-columns:1fr}.project-card{min-height:350px}.project-title{font-size:1.2rem}.project-description{font-size:.9rem}.odin-nav-list{flex-direction:column}.odin-nav-button{width:100%}}.etch-a-sketch-widget{width:100%;height:100%;min-height:700px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;padding:30px;box-sizing:border-box;color:#fff;box-shadow:0 25px 50px #00000040,0 0 0 1px #ffffff1a,inset 0 1px #fff3;position:relative;overflow:hidden}.etch-a-sketch-widget:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 25%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(102,126,234,.15) 0%,transparent 50%);pointer-events:none}.widget-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;z-index:1;position:relative}.widget-title{font-size:32px;font-weight:700;margin:0 0 8px;background:linear-gradient(45deg,gold,#ff6b6b,#4ecdc4,#45b7d1);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite;text-shadow:0 0 30px rgba(255,255,255,.3)}.widget-subtitle{font-size:16px;margin:0;opacity:.8;font-weight:400}.stats-section{display:flex;gap:20px;flex-wrap:wrap}.stat-item{display:flex;flex-direction:column;align-items:center;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:12px 16px;border:1px solid rgba(255,255,255,.2);min-width:80px;transition:all .3s ease}.stat-item:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.stat-icon{font-size:20px;margin-bottom:4px}.stat-label{font-size:12px;opacity:.7;margin-bottom:2px;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:14px;font-weight:700;color:gold}.widget-content{display:flex;gap:30px;align-items:flex-start;z-index:1;position:relative;height:calc(100% - 120px)}.controls-panel{display:flex;flex-direction:column;gap:25px;background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:25px;border:1px solid rgba(255,255,255,.1);min-width:280px;max-width:300px;height:fit-content;box-shadow:0 8px 32px #0000001a}.tool-section{padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.tool-buttons{display:flex;gap:10px}.tool-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:15px 12px;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;color:#fff;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:relative;overflow:hidden}.tool-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .5s ease}.tool-btn:hover:before{left:100%}.tool-btn:hover{transform:translateY(-2px);border-color:#ffffff4d;box-shadow:0 8px 25px #0003}.tool-btn.active{background:linear-gradient(135deg,#4ecdc4,#44a08d);border-color:#4ecdc4;transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.btn-icon{font-size:24px}.btn-text{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.color-section{padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.color-picker-container{display:flex;align-items:center;gap:15px}.color-preview{width:60px;height:60px;border-radius:50%;border:3px solid rgba(255,255,255,.3);position:relative;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0003,inset 0 2px 4px #ffffff1a}.color-preview:hover{transform:scale(1.1);box-shadow:0 8px 25px #0000004d,inset 0 2px 4px #fff3}.color-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;border-radius:50%}.color-info{display:flex;flex-direction:column;gap:4px}.color-label{font-size:12px;opacity:.7;text-transform:uppercase;letter-spacing:.5px}.color-value{font-size:14px;font-weight:600;font-family:Courier New,monospace}.grid-section{padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.slider-container{display:flex;flex-direction:column;gap:12px}.grid-slider{width:100%;height:8px;border-radius:4px;background:#fff3;outline:none;cursor:pointer;transition:all .3s ease}.grid-slider::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#4ecdc4,#44a08d);cursor:pointer;border:3px solid rgba(255,255,255,.8);box-shadow:0 4px 12px #0000004d;transition:all .2s ease}.grid-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 6px 20px #4ecdc466}.grid-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#4ecdc4,#44a08d);cursor:pointer;border:2px solid rgba(255,255,255,.8);box-shadow:0 4px 12px #0000004d}.slider-labels{display:flex;justify-content:space-between;font-size:11px;opacity:.6}.action-section{padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.action-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px 20px;background:linear-gradient(135deg,#ff6b6b,#ee5a24);border:none;border-radius:12px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 15px #ff6b6b4d;position:relative;overflow:hidden}.action-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.action-btn:hover:before{left:100%}.action-btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ff6b6b66}.action-btn:active{transform:translateY(-1px)}.drawing-indicator{display:flex;align-items:center;gap:12px;padding:15px;background:#ffffff0d;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.status-light{width:12px;height:12px;border-radius:50%;background:#ffffff4d;transition:all .3s ease}.status-light.active{background:#4ecdc4;box-shadow:0 0 15px #4ecdc499;animation:pulse 2s ease-in-out infinite}.status-text{font-size:14px;font-weight:500}.canvas-section{flex:1;display:flex;justify-content:center;align-items:center}.canvas-container{background:#fffffff2;border-radius:16px;padding:20px;box-shadow:0 20px 40px #0003,inset 0 1px #fffc;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.drawing-board{width:400px;height:400px;display:flex;flex-direction:column;background:#fff;border-radius:8px;overflow:hidden;box-shadow:inset 0 2px 4px #0000001a,0 4px 8px #0000001a;cursor:crosshair;transition:all .3s ease}.drawing-board.eraser-mode{cursor:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="10" r="8" fill="none" stroke="red" stroke-width="2"/><line x1="6" y1="6" x2="14" y2="14" stroke="red" stroke-width="2"/></svg>') 10 10,auto}.drawing-board:hover{box-shadow:inset 0 2px 4px #00000026,0 8px 25px #00000026}.grid-item{background:#fff;flex-grow:1;border:.5px solid rgba(0,0,0,.05);transition:all .1s ease;position:relative}.grid-item:hover{z-index:1}.colored-pixel{box-shadow:inset 0 1px 2px #0003}.unselectable{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}@media (max-width: 1024px){.widget-content{flex-direction:column;gap:20px}.controls-panel{max-width:none;width:100%;flex-direction:row;flex-wrap:wrap;gap:20px}.controls-panel>div{flex:1;min-width:200px}.drawing-board{width:350px;height:350px}}@media (max-width: 768px){.etch-a-sketch-widget{padding:20px;min-height:600px}.widget-header{flex-direction:column;gap:20px;align-items:flex-start}.stats-section{width:100%;justify-content:space-between}.widget-title{font-size:24px}.controls-panel{flex-direction:column;gap:15px}.controls-panel>div{min-width:auto}.tool-buttons{flex-direction:column;gap:8px}.tool-btn{flex-direction:row;padding:12px 15px}.drawing-board{width:280px;height:280px}}@media (max-width: 480px){.etch-a-sketch-widget{padding:15px;min-height:550px}.widget-title{font-size:20px}.stats-section{flex-wrap:wrap;gap:10px}.stat-item{min-width:70px;padding:8px 12px}.drawing-board{width:240px;height:240px}.canvas-container{padding:15px}}:root{--calc-bg: #1a1a1a;--calc-border: #333;--screen-bg: #0f0f0f;--screen-text: #ffffff;--btn-bg: #2d2d2d;--btn-text: #ffffff;--btn-hover: #404040;--btn-active: #555;--btn-number: #3a3a3a;--btn-number-hover: #4a4a4a;--btn-operator: #ff9500;--btn-operator-hover: #ffad33;--btn-operator-active: #cc7700;--btn-red: #ff3b30;--btn-red-hover: #ff6059;--btn-blue: #007aff;--btn-blue-hover: #3395ff;--btn-disabled: #1a1a1a;--text-disabled: #666;--shadow: rgba(0, 0, 0, .3)}.calculator-widget{display:flex;flex-direction:column;align-items:center;background:linear-gradient(145deg,var(--calc-bg),#262626);color:var(--btn-text);font-family:Roboto,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:30px;border-radius:20px;width:100%;max-width:420px;margin:0 auto;box-shadow:0 20px 40px var(--shadow),0 0 0 1px var(--calc-border)}.calculator-header{text-align:center;margin-bottom:25px}.calculator-header h3{color:var(--screen-text);margin:0 0 8px;font-size:1.4rem;font-weight:600;letter-spacing:.5px}.calculator-header p{color:var(--text-disabled);margin:0;font-size:.85rem;font-style:italic}.calculator{border:1px solid var(--calc-border);border-radius:16px;padding:24px;background:var(--calc-bg);width:100%;box-shadow:inset 0 2px 4px #0000001a}.screen{min-height:80px;padding:24px 20px;border:1px solid var(--calc-border);border-radius:12px;margin-bottom:24px;background:var(--screen-bg);font-size:32px;font-weight:300;text-align:right;word-wrap:break-word;word-break:break-all;color:var(--screen-text);display:flex;align-items:center;justify-content:flex-end;box-shadow:inset 0 2px 8px #0000004d,0 1px 2px #ffffff1a;transition:all .2s ease}.buttons-grid{display:flex;flex-direction:row;gap:12px}.btn{color:var(--btn-text);position:relative;border:none;border-radius:12px;background:var(--btn-number);font-size:18px;font-weight:500;outline:none;cursor:pointer;display:flex;flex:1 1 0;width:50%;height:60px;justify-content:center;align-items:center;margin:3px;transition:all .15s ease;box-shadow:0 2px 8px #00000026,0 1px 2px #0000001a}.btn:hover:not(.disabled){background:var(--btn-number-hover);transform:translateY(-1px);box-shadow:0 4px 12px #0003,0 2px 4px #00000026}.btn:active:not(.disabled){background:var(--btn-active);transform:translateY(0);box-shadow:0 1px 4px #0003,inset 0 1px 2px #0003}.btn.disabled{cursor:not-allowed;opacity:.4;background:var(--btn-disabled);color:var(--text-disabled)}.o-btn{color:var(--btn-text);position:relative;border:none;border-radius:12px;background:var(--btn-operator);font-size:20px;font-weight:600;outline:none;cursor:pointer;display:flex;flex:1 0 0;width:100%;height:50px;justify-content:center;align-items:center;margin:3px 0;transition:all .15s ease;box-shadow:0 2px 8px #00000026,0 1px 2px #0000001a}.o-btn:hover{background:var(--btn-operator-hover);transform:translateY(-1px);box-shadow:0 4px 12px #ff95004d,0 2px 4px #00000026}.o-btn:active{background:var(--btn-operator-active);transform:translateY(0);box-shadow:0 1px 4px #0003,inset 0 1px 2px #0003}.btn-red{background:var(--btn-red);font-weight:600}.btn-red:hover{background:var(--btn-red-hover);transform:translateY(-1px);box-shadow:0 4px 12px #ff3b304d,0 2px 4px #00000026}.btn-red:active{background:var(--btn-red);transform:translateY(0);box-shadow:0 1px 4px #0003,inset 0 1px 2px #0003}.btn-blue{background:var(--btn-blue);font-weight:600}.btn-blue:hover{background:var(--btn-blue-hover);transform:translateY(-1px);box-shadow:0 4px 12px #007aff4d,0 2px 4px #00000026}.btn-blue:active{background:var(--btn-blue);transform:translateY(0);box-shadow:0 1px 4px #0003,inset 0 1px 2px #0003}#numbers{display:flex;flex-direction:column;flex:3}.row{display:flex;margin:4px 0;justify-content:center;gap:6px}#operand-buttons{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex:1;gap:6px}#row-5{margin-bottom:20px}#row-1{margin-bottom:8px}.span-2{height:50px;font-size:16px;font-weight:600}.btn-function{background:linear-gradient(145deg,#4a4a4a,#3a3a3a);color:gold;font-weight:600}.btn-function:hover:not(.disabled){background:linear-gradient(145deg,#5a5a5a,#4a4a4a);color:#ffed4e}.btn-zero{background:var(--btn-number);font-weight:600}.btn-equals{background:var(--btn-operator);font-weight:700;font-size:24px}.btn-equals:hover{background:var(--btn-operator-hover);transform:translateY(-1px);box-shadow:0 4px 12px #ff950066,0 2px 4px #00000026}@media (max-width: 768px){.calculator-widget{padding:20px;max-width:100%;margin:0 10px}.calculator{padding:20px}.screen{font-size:28px;min-height:70px;padding:20px 16px}.btn,.o-btn{font-size:16px;height:50px}.span-2{height:45px;font-size:14px}.buttons-grid{gap:10px}.row,#operand-buttons{gap:4px}}@media (max-width: 480px){.calculator-widget{padding:16px;margin:0 8px}.calculator{padding:16px}.screen{font-size:24px;min-height:60px;padding:16px 12px}.btn,.o-btn{font-size:14px;height:45px}.span-2{height:40px;font-size:12px}.calculator-header h3{font-size:1.2rem}.calculator-header p{font-size:.8rem}.buttons-grid{gap:8px}}@media (max-width: 360px){.calculator-widget{padding:12px;margin:0 4px}.screen{font-size:20px;min-height:50px;padding:12px 10px}.btn,.o-btn{font-size:13px;height:40px}.span-2{height:35px}}.rps-widget{width:100%;height:100%;min-height:600px;display:flex;justify-content:center;align-items:center;padding:20px;box-sizing:border-box;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460)}.rps-dashboard{height:100%;width:100%;max-width:700px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;color:#fff;background:linear-gradient(135deg,#2d1b69,#11998e);border-radius:20px;padding:30px;box-sizing:border-box;min-height:550px;box-shadow:0 20px 40px #0000004d,0 0 0 1px #ffffff1a,inset 0 1px #fff3;position:relative;overflow:hidden}.rps-dashboard:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 80%,rgba(120,119,198,.3) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,119,198,.15) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(120,219,226,.1) 0%,transparent 50%);pointer-events:none}.game-header{text-align:center;margin-bottom:20px;z-index:1}.game-title{font-size:28px;font-weight:700;margin:0 0 10px;text-shadow:2px 2px 4px rgba(0,0,0,.5);background:linear-gradient(45deg,gold,#ff6b6b,#4ecdc4);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 3s ease infinite}.round-indicator{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.2);font-size:14px;font-weight:500}.battle-arena{display:flex;justify-content:space-between;align-items:center;width:100%;margin:20px 0;padding:20px;background:#0003;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);z-index:1}.player-side,.computer-side{flex:1;display:flex;justify-content:center}.choice-display{display:flex;flex-direction:column;align-items:center;gap:10px}.choice-emoji{font-size:60px;width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:50%;border:2px solid rgba(255,255,255,.2);transition:all .3s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.choice-emoji.thinking{animation:pulse 1s ease-in-out infinite}.choice-label{font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:#fffc}.vs-divider{margin:0 20px;display:flex;align-items:center;justify-content:center}.vs-text{font-size:24px;font-weight:700;background:linear-gradient(45deg,#ff6b6b,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 20px rgba(255,107,107,.5);animation:glow 2s ease-in-out infinite alternate}.score-board{display:flex;align-items:center;justify-content:center;gap:30px;margin:20px 0;padding:20px;background:#0000004d;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);z-index:1}.score-item{display:flex;flex-direction:column;align-items:center;gap:8px}.score-label{font-size:14px;opacity:.8;font-weight:500}.score-value{font-size:32px;font-weight:700;text-shadow:0 0 10px currentColor}.score-item.player .score-value{color:#4ecdc4}.score-item.computer .score-value{color:#ff6b6b}.score-divider{font-size:24px;font-weight:700;opacity:.5}.rps-message{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:15px;padding:20px;text-align:center;border:1px solid rgba(255,255,255,.2);margin:10px 0;min-height:60px;display:flex;align-items:center;justify-content:center;z-index:1}.rps-message p{margin:0;font-size:18px;font-weight:500;line-height:1.4;transition:all .3s ease}.game-over-message{font-size:20px!important;font-weight:700!important;animation:celebration .6s ease-in-out}.status-message{background:#0003;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:10px;padding:12px 20px;text-align:center;border:1px solid rgba(255,255,255,.1);margin:10px 0;z-index:1}.status-message p{margin:0;font-size:14px;opacity:.9;transition:all .3s ease}.status-message p.thinking{animation:fadeInOut 1.5s ease-in-out infinite}.rps-container{display:flex;justify-content:center;align-items:center;gap:20px;margin:20px 0;padding:20px;background:#0003;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);z-index:1}.rps-btn{background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:2px solid rgba(255,255,255,.2);border-radius:15px;color:#fff;padding:15px 20px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;gap:8px;min-width:100px;position:relative;overflow:hidden}.rps-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.rps-btn:hover:not(:disabled):before{left:100%}.rps-btn:hover:not(:disabled){transform:translateY(-5px) scale(1.05);border-color:#fff6;box-shadow:0 10px 25px #0000004d,0 0 20px #ffffff1a}.rps-btn:active:not(:disabled){transform:translateY(-2px) scale(1.02)}.rps-btn.disabled{opacity:.5;cursor:not-allowed;transform:none!important}.rps-btn-on{background:linear-gradient(135deg,#4ecdc4,#44a08d)!important;border-color:#4ecdc4!important;transform:translateY(-3px) scale(1.05)!important;box-shadow:0 8px 25px #4ecdc466,0 0 20px #4ecdc44d!important}.btn-emoji{font-size:28px;display:block}.btn-text{font-size:14px;text-transform:uppercase;letter-spacing:.5px}.rps-reset{margin-top:20px;z-index:1}.reset-btn{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;border:none;border-radius:15px;padding:15px 30px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:1px;box-shadow:0 8px 25px #ff6b6b4d;position:relative;overflow:hidden}.reset-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.reset-btn:hover:before{left:100%}.reset-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 35px #ff6b6b66}.reset-btn:active{transform:translateY(-1px) scale(1.02)}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}@keyframes glow{0%{text-shadow:0 0 20px rgba(255,107,107,.5)}to{text-shadow:0 0 30px rgba(255,107,107,.8),0 0 40px rgba(255,215,0,.3)}}@keyframes celebration{0%,to{transform:scale(1)}25%{transform:scale(1.05) rotate(1deg)}75%{transform:scale(1.05) rotate(-1deg)}}@keyframes fadeInOut{0%,to{opacity:.9}50%{opacity:.5}}@media (max-width: 768px){.rps-widget{min-height:550px;padding:15px}.rps-dashboard{padding:20px;min-height:500px}.game-title{font-size:24px}.battle-arena{flex-direction:column;gap:20px;padding:15px}.vs-divider{margin:0}.vs-text{font-size:20px}.choice-emoji{font-size:50px;width:70px;height:70px}.rps-container{flex-direction:column;gap:15px;padding:15px}.rps-btn{width:120px;padding:12px 16px}.score-board{gap:20px;padding:15px}.score-value{font-size:28px}}@media (max-width: 480px){.rps-widget{padding:10px;min-height:500px}.rps-dashboard{padding:15px;min-height:450px;border-radius:15px}.game-title{font-size:20px}.choice-emoji{font-size:40px;width:60px;height:60px}.rps-message p{font-size:16px}.btn-emoji{font-size:24px}.btn-text{font-size:12px}}.tictactoe-widget{width:100%;height:100%;min-height:650px;background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);border-radius:20px;padding:30px;box-sizing:border-box;color:#fff;box-shadow:0 25px 50px #00000040,0 0 0 1px #ffffff1a,inset 0 1px #fff3;position:relative;overflow:hidden}.tictactoe-widget:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(102,126,234,.15) 0%,transparent 50%);pointer-events:none}.game-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;z-index:1;position:relative}.game-title{font-size:32px;font-weight:700;margin:0 0 8px;background:linear-gradient(45deg,gold,#ff6b6b,#4ecdc4,#45b7d1);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite;text-shadow:0 0 30px rgba(255,255,255,.3)}.game-subtitle{font-size:16px;margin:0;opacity:.8;font-weight:400}.game-info{display:flex;flex-direction:column;align-items:flex-end;gap:10px;min-width:200px}.status-display{display:flex;flex-direction:column;align-items:flex-end;gap:5px}.current-status{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.2)}.status-text{font-size:14px;font-weight:600}.move-counter{font-size:12px;opacity:.8}.progress-bar{width:200px;height:4px;background:#fff3;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(45deg,#4ecdc4,#44a08d);border-radius:2px;transition:width .3s ease}.game-content{display:flex;gap:30px;z-index:1;position:relative;height:calc(100% - 120px)}.game-board-section{flex:1;display:flex;justify-content:center;align-items:center}.board-container{background:#fffffff2;border-radius:16px;padding:20px;box-shadow:0 20px 40px #0003,inset 0 1px #fffc;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-board{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:8px;width:320px;height:320px;background:#0000001a;border-radius:12px;padding:12px}.game-cell{background:linear-gradient(135deg,#fff,#f8f9fa);border:none;border-radius:8px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;font-size:0;box-shadow:0 2px 8px #0000001a,inset 0 1px #fffc;position:relative;overflow:hidden}.game-cell:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.game-cell.playable:hover:before{left:100%}.game-cell.playable:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 25px #00000026,inset 0 1px #ffffffe6}.game-cell.filled{cursor:default;transform:none!important}.game-cell.filled.x{background:linear-gradient(135deg,#4ecdc4,#44a08d);color:#fff}.game-cell.filled.o{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}.game-cell.winning{animation:winningPulse 1s ease-in-out infinite;box-shadow:0 0 20px #ffd70099,inset 0 1px #ffffffe6}.cell-content{font-size:48px;font-weight:700;transition:all .3s ease;text-shadow:0 2px 4px rgba(0,0,0,.3)}.game-sidebar{display:flex;flex-direction:column;gap:25px;min-width:280px;max-width:300px}.scoreboard{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.score-items{display:flex;flex-direction:column;gap:15px}.score-item{display:flex;align-items:center;gap:15px;padding:12px 16px;background:#ffffff0d;border-radius:12px;border:2px solid rgba(255,255,255,.1);transition:all .3s ease}.score-item.active{border-color:gold;background:#ffd7001a;box-shadow:0 0 15px #ffd7004d}.score-item.player-x.active{border-color:#4ecdc4;background:#4ecdc41a;box-shadow:0 0 15px #4ecdc44d}.score-item.player-o.active{border-color:#ff6b6b;background:#ff6b6b1a;box-shadow:0 0 15px #ff6b6b4d}.player-symbol{font-size:24px;font-weight:700;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff1a}.player-info{display:flex;flex-direction:column;flex:1}.player-name{font-size:14px;font-weight:600;opacity:.9}.player-score{font-size:20px;font-weight:700;color:gold}.vs-divider{text-align:center;font-size:16px;font-weight:700;opacity:.7;padding:8px 0}.game-controls{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.control-buttons{display:flex;flex-direction:column;gap:12px}.control-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border:none;border-radius:12px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.5px;position:relative;overflow:hidden}.control-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.control-btn:hover:before{left:100%}.new-game-btn{background:linear-gradient(135deg,#4ecdc4,#44a08d);color:#fff;box-shadow:0 4px 15px #4ecdc44d}.new-game-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc466}.reset-scores-btn{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;box-shadow:0 4px 15px #ff6b6b4d}.reset-scores-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff6b6b66}.btn-icon{font-size:16px}.game-stats{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat-item{display:flex;flex-direction:column;align-items:center;padding:12px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.stat-label{font-size:11px;opacity:.7;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.stat-value{font-size:18px;font-weight:700;color:gold}.game-history{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.history-list{display:flex;flex-direction:column;gap:8px}.history-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1);font-size:12px}.history-winner{font-weight:600}.history-details{display:flex;flex-direction:column;align-items:flex-end;gap:2px;opacity:.7;font-size:10px}@keyframes winningPulse{0%,to{transform:scale(1);box-shadow:0 0 20px #ffd70099,inset 0 1px #ffffffe6}50%{transform:scale(1.05);box-shadow:0 0 30px #ffd700cc,inset 0 1px #ffffffe6}}@media (max-width: 1024px){.game-content{flex-direction:column;gap:20px}.game-sidebar{max-width:none;width:100%;flex-direction:row;flex-wrap:wrap;gap:20px}.game-sidebar>div{flex:1;min-width:250px}.game-board{width:280px;height:280px}}@media (max-width: 768px){.tictactoe-widget{padding:20px;min-height:600px}.game-header{flex-direction:column;gap:20px;align-items:flex-start}.game-info{width:100%;align-items:flex-start}.game-title{font-size:24px}.game-sidebar{flex-direction:column;gap:15px}.game-sidebar>div{min-width:auto}.game-board{width:240px;height:240px}.cell-content{font-size:36px}}@media (max-width: 480px){.tictactoe-widget{padding:15px;min-height:550px}.game-title{font-size:20px}.game-board{width:200px;height:200px}.cell-content{font-size:28px}.board-container{padding:15px}.stats-grid{grid-template-columns:1fr}}.library-widget{width:100%;height:100%;min-height:700px;background:linear-gradient(135deg,#8360c3,#2ebf91,#4ecdc4);border-radius:20px;padding:30px;box-sizing:border-box;color:#fff;box-shadow:0 25px 50px #00000040,0 0 0 1px #ffffff1a,inset 0 1px #fff3;position:relative;overflow:hidden}.library-widget:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 25%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(131,96,195,.15) 0%,transparent 50%);pointer-events:none}.library-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;z-index:1;position:relative}.library-title{font-size:32px;font-weight:700;margin:0 0 8px;background:linear-gradient(45deg,gold,#ff6b6b,#4ecdc4,#45b7d1);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite;text-shadow:0 0 30px rgba(255,255,255,.3)}.library-subtitle{font-size:16px;margin:0;opacity:.8;font-weight:400}.library-content{display:flex;gap:30px;z-index:1;position:relative;height:calc(100% - 120px)}.control-panel{display:flex;flex-direction:column;gap:25px;min-width:320px;max-width:340px}.form-section,.search-section,.actions-section{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.section-title{font-size:16px;font-weight:600;margin:0 0 15px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group{margin-bottom:15px}.form-label{display:block;font-size:12px;font-weight:500;margin-bottom:6px;opacity:.8;text-transform:uppercase;letter-spacing:.5px}.form-input{width:100%;padding:12px 16px;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:14px;transition:all .3s ease;box-sizing:border-box}.form-input::placeholder{color:#ffffff80}.form-input:focus{outline:none;border-color:#4ecdc4;background:#ffffff26;box-shadow:0 0 10px #4ecdc44d}.read-toggle{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 16px;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.read-toggle.read{background:#4caf5033;border-color:#4caf50;color:#4caf50}.read-toggle.unread{background:#ff980033;border-color:#ff9800;color:#ff9800}.read-toggle:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0003}.toggle-icon{font-size:16px}.toggle-text{font-weight:600}.add-book-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:14px 20px;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:12px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 15px #4ecdc44d;position:relative;overflow:hidden}.add-book-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.add-book-btn:hover:before{left:100%}.add-book-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc466}.search-types{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:15px}.search-type-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:12px;cursor:pointer;transition:all .3s ease}.search-type-btn.active{background:#4ecdc433;border-color:#4ecdc4;color:#4ecdc4}.search-type-btn:hover{transform:translateY(-1px);border-color:#ffffff4d}.search-actions{display:flex;gap:10px}.search-btn,.clear-search-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.search-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea4d}.search-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #667eea66}.clear-search-btn{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;box-shadow:0 4px 15px #ff6b6b4d}.clear-search-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #ff6b6b66}.danger-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 16px;background:linear-gradient(135deg,#ff6b6b,#ee5a24);border:none;border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 15px #ff6b6b4d;font-size:12px}.danger-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff6b6b66}.search-info{margin-top:10px;padding:8px 12px;background:#ffffff1a;border-radius:6px;text-align:center}.search-results-text{font-size:12px;opacity:.8}.books-section{flex:1;display:flex;flex-direction:column}.books-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.books-count{font-size:14px;opacity:.7;background:#ffffff1a;padding:4px 12px;border-radius:12px}.books-container{flex:1;background:#fffffff2;border-radius:16px;padding:20px;box-shadow:0 20px 40px #0003,inset 0 1px #fffc;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-y:auto}.books-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.book-card{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:12px;padding:20px;box-shadow:0 4px 15px #0000001a,0 1px 3px #00000014;border:1px solid rgba(0,0,0,.05);position:relative;transition:all .3s ease;color:#333}.book-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #00000026,0 4px 8px #0000001a}.delete-btn{position:absolute;top:12px;right:12px;background:#ff6b6b1a;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:14px}.delete-btn:hover{background:#ff6b6b33;transform:scale(1.1)}.book-info{margin-bottom:15px}.book-title{font-size:18px;font-weight:700;margin:0 0 8px;color:#333;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.book-author{font-size:14px;color:#666;margin:0 0 6px;font-style:italic}.book-pages{font-size:12px;color:#888;margin:0 0 4px}.book-date{font-size:11px;color:#aaa;margin:0}.read-status-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 14px;border:2px solid;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:13px}.read-status-btn.read{background:#4caf501a;border-color:#4caf50;color:#4caf50}.read-status-btn.read:hover{background:#4caf5033}.read-status-btn.unread{background:#ff98001a;border-color:#ff9800;color:#ff9800}.read-status-btn.unread:hover{background:#ff980033}.status-icon,.btn-icon{font-size:16px}@media (max-width: 1024px){.library-content{flex-direction:column;gap:20px}.control-panel{max-width:none;width:100%;flex-direction:row;flex-wrap:wrap;gap:20px}.control-panel>div{flex:1;min-width:280px}.books-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px}}@media (max-width: 768px){.library-widget{padding:20px;min-height:650px}.library-header{flex-direction:column;gap:20px;align-items:flex-start}.stats-section{width:100%;justify-content:space-between;gap:10px}.stat-card{flex:1;min-width:80px;padding:8px 12px}.library-title{font-size:24px}.control-panel{flex-direction:column;gap:15px}.control-panel>div{min-width:auto}.search-types{grid-template-columns:1fr 1fr;gap:6px}.books-grid{grid-template-columns:1fr;gap:12px}}@media (max-width: 480px){.library-widget{padding:15px;min-height:600px}.library-title{font-size:20px}.stats-section{flex-wrap:wrap;gap:8px}.stat-card{min-width:70px;padding:6px 10px}.stat-value{font-size:16px}.books-container,.book-card{padding:15px}}.todo-widget{width:100%;height:100%;min-height:700px;background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);border-radius:20px;padding:30px;box-sizing:border-box;color:#fff;box-shadow:0 25px 50px #00000040,0 0 0 1px #ffffff1a,inset 0 1px #fff3;position:relative;overflow:hidden}.todo-widget:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 25%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(102,126,234,.15) 0%,transparent 50%);pointer-events:none}.todo-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;z-index:1;position:relative}.title-section{flex:1}.todo-title{font-size:32px;font-weight:700;margin:0 0 8px;background:linear-gradient(45deg,gold,#ff6b6b,#4ecdc4,#45b7d1);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease infinite;text-shadow:0 0 30px rgba(255,255,255,.3)}.todo-subtitle{font-size:16px;margin:0;opacity:.8;font-weight:400}.stats-section{display:flex;gap:15px;flex-wrap:wrap}.stat-card{display:flex;align-items:center;gap:12px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:12px 16px;border:1px solid rgba(255,255,255,.2);min-width:100px;transition:all .3s ease}.stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.stat-icon{font-size:20px}.stat-info{display:flex;flex-direction:column}.stat-value{font-size:18px;font-weight:700;color:gold;line-height:1}.stat-label{font-size:11px;opacity:.7;text-transform:uppercase;letter-spacing:.5px}.todo-content{display:flex;gap:30px;z-index:1;position:relative;height:calc(100% - 120px)}.projects-sidebar{min-width:200px;max-width:320px;background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000001a}.projects-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.section-title{font-size:16px;font-weight:600;margin:0;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.add-project-btn{background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #4ecdc44d}.add-project-btn:hover{transform:translateY(-2px) scale(1.1);box-shadow:0 8px 25px #4ecdc466}.projects-list{display:flex;flex-direction:column;gap:10px;max-height:400px;overflow-y:auto}.project-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:12px;cursor:pointer;transition:all .3s ease}.project-item:hover{border-color:#ffffff4d;background:#ffffff1a}.project-item.active{border-color:#4ecdc4;background:#4ecdc426;box-shadow:0 0 15px #4ecdc44d}.project-content{flex:1;display:flex;flex-direction:column;gap:4px}.project-title{font-size:14px;font-weight:600;color:#fff}.project-date{font-size:11px;opacity:.6}.project-input{background:#ffffff1a;border:2px solid #4ecdc4;border-radius:6px;padding:6px 10px;color:#fff;font-size:14px;font-weight:600;width:100%}.project-input:focus{outline:none;box-shadow:0 0 10px #4ecdc480}.delete-project-btn{background:#ff6b6b33;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:12px;margin-left:8px}.delete-project-btn:hover{background:#ff6b6b66;transform:scale(1.1)}.tasks-main{flex:1;display:flex;flex-direction:column}.tasks-header{background:#fffffff2;border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:0 8px 25px #0000001a,inset 0 1px #fffc;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#333}.current-project{margin-bottom:20px}.project-name{font-size:24px;font-weight:700;margin:0;color:#333}.add-task-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.task-title-input{flex:2;min-width:200px;padding:12px 16px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:8px;color:#333;font-size:14px;transition:all .3s ease}.task-title-input:focus{outline:none;border-color:#4ecdc4;box-shadow:0 0 10px #4ecdc44d}.task-priority-select,.task-date-input{padding:12px 16px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:8px;color:#333;font-size:14px;cursor:pointer}.add-task-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:8px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 15px #4ecdc44d}.add-task-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc466}.tasks-container{flex:1;background:#fffffff2;border-radius:16px;padding:20px;box-shadow:0 20px 40px #0003,inset 0 1px #fffc;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-y:auto}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;text-align:center;color:#666}.empty-icon{font-size:64px;margin-bottom:20px;opacity:.5}.empty-title{font-size:24px;margin:0 0 10px;color:#333}.empty-message{font-size:16px;margin:0;opacity:.7}.tasks-list{display:flex;flex-direction:column;gap:20px}.task-card{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:12px;padding:20px;box-shadow:0 4px 15px #0000001a,0 1px 3px #00000014;border:1px solid rgba(0,0,0,.05);transition:all .3s ease;color:#333}.task-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026,0 4px 8px #0000001a}.task-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px}.task-title-section{flex:1}.task-title{font-size:18px;font-weight:700;margin:0 0 8px;color:#333;cursor:pointer}.task-title:hover{color:#4ecdc4}.task-title-edit{background:#4ecdc41a;border:2px solid #4ecdc4;border-radius:6px;padding:8px 12px;color:#333;font-size:18px;font-weight:700;width:100%}.task-title-edit:focus{outline:none;box-shadow:0 0 10px #4ecdc480}.task-meta{display:flex;gap:15px;align-items:center}.task-priority{padding:4px 8px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.priority-high{background:#f443361a;color:#f44336;border:1px solid rgba(244,67,54,.3)}.priority-medium{background:#ff98001a;color:#ff9800;border:1px solid rgba(255,152,0,.3)}.priority-low{background:#4caf501a;color:#4caf50;border:1px solid rgba(76,175,80,.3)}.task-due-date{font-size:12px;color:#666}.task-actions{display:flex;gap:8px;align-items:center}.status-btn{padding:8px 12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:16px}.status-draft{background:#667eea1a;color:#667eea}.status-done{background:#4caf501a;color:#4caf50}.status-btn:hover{transform:scale(1.1)}.delete-task-btn{background:#ff6b6b1a;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:14px}.delete-task-btn:hover{background:#ff6b6b33;transform:scale(1.1)}.task-body{display:grid;grid-template-columns:1fr 1fr;gap:20px}.task-description{grid-column:1 / -1}.description-input,.notes-input{width:100%;padding:12px 16px;background:#fffc;border:2px solid rgba(0,0,0,.1);border-radius:8px;color:#333;font-size:14px;resize:vertical;min-height:80px;transition:all .3s ease;box-sizing:border-box}.description-input:focus,.notes-input:focus{outline:none;border-color:#4ecdc4;box-shadow:0 0 10px #4ecdc44d}.task-checklist{background:#00000005;border-radius:8px;padding:15px}.checklist-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.checklist-title{font-size:14px;font-weight:600;color:#333}.add-checklist-btn{background:#4ecdc41a;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:12px;color:#4ecdc4}.add-checklist-btn:hover{background:#4ecdc433;transform:scale(1.1)}.checklist-items{display:flex;flex-direction:column;gap:8px}.checklist-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ffffff80;border-radius:6px;border:1px solid rgba(0,0,0,.05)}.checklist-input{flex:1;background:transparent;border:none;color:#333;font-size:12px;padding:4px 0}.checklist-input:focus{outline:none}.delete-checklist-btn{background:#ff6b6b1a;border:none;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:10px}.delete-checklist-btn:hover{background:#ff6b6b33;transform:scale(1.1)}.btn-icon{font-size:14px}.btn-text{font-size:12px}@keyframes gradientShift{0%,to{background-position:0% 50%}25%{background-position:100% 50%}50%{background-position:50% 100%}75%{background-position:0% 100%}}@media (max-width: 1024px){.todo-content{flex-direction:column;gap:20px}.projects-sidebar{max-width:none;width:100%}.projects-list{flex-direction:row;overflow-x:auto;max-height:none}.project-item{min-width:200px}.task-body{grid-template-columns:1fr}}@media (max-width: 768px){.todo-widget{padding:20px;min-height:650px}.todo-header{flex-direction:column;gap:20px;align-items:flex-start}.stats-section{width:100%;justify-content:space-between;gap:10px}.stat-card{flex:1;min-width:80px;padding:8px 12px}.todo-title{font-size:24px}.add-task-form{flex-direction:column;gap:10px}.add-task-form>*{width:100%}.task-header{flex-direction:column;gap:15px;align-items:flex-start}.task-actions{width:100%;justify-content:flex-end}}@media (max-width: 480px){.todo-widget{padding:15px;min-height:600px}.todo-title{font-size:20px}.stats-section{flex-wrap:wrap;gap:8px}.stat-card{min-width:70px;padding:6px 10px}.tasks-container,.task-card{padding:15px}}.contact-container{min-height:100vh;padding:2rem 0;display:flex;align-items:center;justify-content:center}.contact-content{max-width:1200px;width:100%;margin:0;padding:0;background:#ffffff0d;border-radius:20px;box-shadow:0 20px 40px #0000001a;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.contact-header{text-align:center;padding:3rem 2rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.contact-header h1{font-size:2.5rem;margin-bottom:1rem;font-weight:700}.contact-header p{font-size:1.1rem;opacity:.9;max-width:600px;margin:0 auto;line-height:1.6}.contact-body{display:grid;grid-template-columns:1fr 2fr;gap:3rem;padding:3rem}.contact-info h2{color:#fff;font-size:1.8rem;margin-bottom:2rem;font-weight:600}.contact-item{margin-bottom:2rem;padding:1.5rem;background:#ffffff0d;border-radius:12px;border-left:4px solid #667eea}.contact-item h3{color:#667eea;font-size:1.1rem;margin-bottom:.5rem;font-weight:600}.contact-item p{color:#fff;margin:0;font-size:1rem}.contact-form{background:#ffffff0d;border-radius:12px;padding:1rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;color:#fff;font-weight:600;font-size:1rem}.form-group input,.form-group textarea{width:80%;padding:.875rem 1rem;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;font-family:inherit;transition:all .3s ease;background:#ffffff0d}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea;background:#ffffff4d;box-shadow:0 0 0 3px #667eea1a}.form-group textarea{resize:vertical;min-height:120px}.submit-btn{width:100%;padding:1rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.submit-btn:disabled{opacity:.7;cursor:not-allowed}.submit-message{margin-top:1rem;padding:1rem;border-radius:8px;text-align:center;font-weight:500}.submit-message.success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.submit-message.error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}@media (max-width: 768px){.contact-content{width:95%;margin:1rem auto}.contact-header{padding:2rem 1.5rem 1.5rem}.contact-header h1{font-size:2rem}.contact-header p{font-size:1rem}.contact-body{grid-template-columns:1fr;gap:2rem;padding:2rem 1.5rem}.contact-info{order:2}.contact-form{order:1}.contact-item{padding:1rem}}@media (max-width: 480px){.contact-container{padding:1rem 0}.contact-header{padding:1.5rem 1rem}.contact-header h1{font-size:1.8rem}.contact-body{padding:1.5rem 1rem}.form-group input,.form-group textarea{padding:.75rem}.submit-btn{padding:.875rem;font-size:1rem}}.form-group{animation:slideUp .6s ease forwards;opacity:0;transform:translateY(20px)}.form-group:nth-child(1){animation-delay:.1s}.form-group:nth-child(2){animation-delay:.2s}.form-group:nth-child(3){animation-delay:.3s}.form-group:nth-child(4){animation-delay:.4s}.submit-btn{animation:slideUp .6s ease forwards;animation-delay:.5s;opacity:0;transform:translateY(20px)}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}.contact-item{animation:slideUp .6s ease forwards;opacity:0;transform:translateY(20px)}.contact-item:nth-child(1){animation-delay:.2s}.contact-item:nth-child(2){animation-delay:.4s}.contact-item:nth-child(3){animation-delay:.6s}#root{height:100vh;max-width:93vw;margin:0 auto;text-align:center}.home-main-content{margin-top:1rem}.home-header-section{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:2rem;gap:2rem;margin-bottom:2rem;border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 32px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d}.home-header-text{flex:1;text-align:left}.profile-image img{width:200px;height:200px;border-radius:50%;object-fit:cover;box-shadow:0 4px 8px #0000001a}.social-media-section{display:flex;flex-direction:column;gap:1rem;align-items:center}.social-icon{width:40px;height:40px;transition:transform .2s ease}.social-icon:hover{transform:scale(1.1)}.text-primary{color:#ec0099;color:color(display-p3 .8824 0 .5961)}.home-intro-section{font-size:1.6rem}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.graphql-logo{width:100px;height:100px}.card{padding:2em}.read-the-docs{color:#888}