:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*{box-sizing:border-box;scroll-behavior:smooth;margin:0;padding:0}html,body{width:100%;overflow-x:hidden}body{color:#704657;background:#fff7fa;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.app{background:radial-gradient(circle at 50% 0,#ffb6c159,#0000 45%),radial-gradient(circle at 10% 40%,#ffdae166,#0000 40%),#fff7fa;width:100%;min-height:100vh;overflow-x:hidden}.navbar{-webkit-backdrop-filter:blur(18px);z-index:1000;background:#fff5f8d1;border:1px solid #e08da74d;border-radius:18px;justify-content:space-between;align-items:center;width:min(92%,1000px);padding:16px 24px;display:flex;position:fixed;top:18px;left:50%;transform:translate(-50%);box-shadow:0 10px 40px #be6e871f}.logo{flex-shrink:0;font-size:1.35rem;font-weight:800;color:#b83f67!important;background:0 0!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:#b83f67!important}.nav-links{align-items:center;gap:28px;display:flex}.nav-links a{color:#713d53;-webkit-tap-highlight-color:transparent;outline:none;font-size:.95rem;font-weight:600;text-decoration:none;transition:color .3s,text-shadow .3s;position:relative}.nav-links a:after{content:"";background:#b83f67;border-radius:10px;width:0;height:2px;transition:width .3s;position:absolute;bottom:-6px;left:0}.nav-links a:hover{color:#b83f67;text-shadow:0 0 15px #b83f6740}.nav-links a:hover:after{width:100%}.nav-links a:focus,.nav-links a:active{color:#b83f67;-webkit-tap-highlight-color:transparent;outline:none}.nav-links a:focus:after,.nav-links a:active:after{width:100%}.menu-toggle{color:#b83f67;cursor:pointer;background:0 0;border:none;padding:5px;font-size:1.7rem;font-weight:700;line-height:1;transition:all .2s;display:none}.menu-toggle:hover{color:#8f2f51;transform:scale(1.05)}.hero{text-align:center;justify-content:center;align-items:center;min-height:90vh;padding:170px 20px 100px;display:flex;position:relative;overflow:hidden}.hero-content{width:100%;max-width:850px;animation:.8s both heroFadeIn}.small-text{letter-spacing:4px;margin-bottom:18px;font-size:.9rem;font-weight:800;color:#b83f67!important;background:0 0!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:#b83f67!important}.hero h1{letter-spacing:-4px;margin-bottom:25px;font-size:clamp(3.5rem,9vw,7rem);font-weight:900;line-height:1;color:#b83f67!important;background:0 0!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:#b83f67!important}.hero h2{color:#713d53;margin-bottom:25px;font-size:clamp(1.4rem,3vw,2rem);font-weight:700}.hero-description{color:#704657;max-width:700px;margin-left:auto;margin-right:auto;font-size:1.05rem;font-weight:500;line-height:1.8}@keyframes heroFadeIn{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.projects{max-width:1100px;margin:auto;padding:100px 25px}.section-heading{text-align:center;margin-bottom:55px}.section-heading p,.contact>p{color:#7a2948;letter-spacing:4px;margin-bottom:12px;font-size:.8rem;font-weight:700}.section-heading h2{color:#6f2744;font-size:clamp(2rem,5vw,3rem);font-weight:800}.project-grid{grid-template-columns:repeat(3,1fr);align-items:stretch;gap:25px;display:grid}.project-card{background:linear-gradient(145deg,#ffe0e8a6,#fffafcd9);border:1px solid #e08da740;border-radius:24px;flex-direction:column;min-height:360px;padding:35px;transition:transform .35s,border-color .35s,box-shadow .35s;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px #be6e8714}.project-card:before{content:"";filter:blur(70px);opacity:.35;background:#f3a9bd;width:120px;height:120px;position:absolute;top:-60px;right:-60px}.project-card:hover{border-color:#e08da78c;transform:translateY(-8px);box-shadow:0 20px 50px #be6e8726,0 0 30px #ffb6c12e}.project-card span{color:#7a2948;font-size:.85rem;font-weight:700}.project-card h3{color:#6f2744;margin:35px 0 15px;font-size:1.45rem;font-weight:800}.project-card p{color:#704657;flex:1;margin-bottom:25px;font-weight:500;line-height:1.7}.project-card button{color:#842f50;cursor:pointer;background:#ffeef4cc;border:1px solid #e08da759;border-radius:10px;align-self:center;padding:11px 20px;font-size:.95rem;font-weight:700;transition:all .3s}.project-card button:hover{color:#fff9fb;background:linear-gradient(135deg,#e89ab2,#d97898);border-color:#0000;transform:translateY(-3px);box-shadow:0 10px 25px #d978984d}.contact{text-align:center;background:radial-gradient(circle,#ffb6c159,#0000 50%);margin-top:30px;padding:130px 20px;position:relative;overflow:hidden}.contact h2{color:#6f2744;margin-bottom:35px;font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;line-height:1.2}.contact-link{color:#fff9fb;background:linear-gradient(135deg,#e89ab2,#d97898);border-radius:12px;padding:14px 28px;font-weight:700;text-decoration:none;transition:all .3s;display:inline-block;box-shadow:0 10px 35px #d9789840}.contact-link:hover{transform:translateY(-4px);box-shadow:0 15px 35px #d9789859}footer{text-align:center;color:#8a5267;border-top:1px solid #e08da726;padding:30px 20px;font-size:.85rem;font-weight:600}.portfolio-details-page{color:#704657;background:radial-gradient(circle at 50% 10%,#ffb6c166,#0000 45%),radial-gradient(circle at 10% 80%,#ffdae173,#0000 40%),#fff7fa;justify-content:center;align-items:flex-start;min-height:100vh;padding:110px 20px 70px;display:flex}.back-button{z-index:2000!important;color:#842f50!important;cursor:pointer!important;background:#fff0f5!important;border:1px solid #e8a0b8!important;border-radius:12px!important;padding:11px 20px!important;font-size:.95rem!important;font-weight:700!important;transition:all .3s!important;position:fixed!important;top:20px!important;left:20px!important;box-shadow:0 8px 25px #d870932e!important}.back-button:hover{color:#6f2744!important;background:#ffdce8!important;border-color:#df7f9f!important;transform:translateY(-2px)!important;box-shadow:0 10px 30px #d8709340!important}.portfolio-details-card{-webkit-backdrop-filter:blur(20px);background:#ffffffd1;border:1px solid #e08da74d;border-radius:28px;width:min(100%,850px);padding:55px;box-shadow:0 25px 70px #be6e8724}.details-label{color:#7a2948;letter-spacing:4px;margin-bottom:15px;font-size:.8rem;font-weight:700}.portfolio-details-card h1{color:#b83f67;margin-bottom:25px;font-size:clamp(2.8rem,7vw,5rem);font-weight:900;line-height:1.15;background:0 0!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:#b83f67!important}.details-intro{color:#704657;max-width:700px;font-size:1.1rem;font-weight:500;line-height:1.8}.details-section{margin-top:45px}.details-section h2{color:#6f2744;margin-bottom:15px;font-size:1.4rem;font-weight:800}.details-section p{color:#704657;font-weight:500;line-height:1.8}.tech-list{flex-wrap:wrap;gap:10px;display:flex}.tech-list span{color:#842f50;background:#ffe0e88c;border:1px solid #e08da740;border-radius:10px;padding:9px 15px;font-weight:700}.feature-list{text-align:left;max-width:600px;margin:0 auto;padding:0;list-style:none}.feature-list li{color:#704657;margin-bottom:14px;padding-left:28px;font-weight:500;line-height:1.6;position:relative}.feature-list li:before{content:"✦";color:#c95f7f;position:absolute;left:0}.details-highlight{background:#ffe0e873;border:1px solid #e08da733;border-radius:15px;align-items:center;gap:15px;margin-top:45px;padding:20px;display:flex}.details-highlight span{font-size:1.8rem}.details-highlight p{color:#704657;font-weight:500;line-height:1.6}@media (width<=800px){.project-grid{grid-template-columns:1fr}.navbar{width:94%}.hero{min-height:80vh;padding-top:150px}}@media (width<=600px){.navbar{flex-wrap:wrap;width:calc(100% - 30px);padding:14px 18px}.menu-toggle{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;padding:5px;font-size:1.7rem;font-weight:700;color:#b83f67!important;display:block!important}.nav-links{flex-direction:column;align-items:center;gap:18px;width:100%;padding-top:18px;display:none!important}.nav-links.active{display:flex!important}.nav-links a{color:#713d53;-webkit-tap-highlight-color:transparent;outline:none;padding:4px 0;font-size:.95rem}.nav-links a:hover,.nav-links a:focus,.nav-links a:active{color:#b83f67;outline:none}.nav-links a:focus:after,.nav-links a:active:after{width:100%}.hero{padding:140px 20px 70px}.hero h1{letter-spacing:-2px;font-size:clamp(3rem,15vw,5rem)}.hero h2{font-size:1.35rem}.hero-description{font-size:.95rem}.projects{padding:80px 20px}.project-grid{grid-template-columns:1fr}.project-card{min-height:auto;padding:28px}.contact{padding:100px 20px}.portfolio-details-card{padding:30px 22px}.back-button{padding:10px 17px!important;top:15px!important;left:15px!important}}@media (width<=400px){.navbar{width:calc(100% - 24px);padding:13px 15px}.logo{font-size:1.15rem}.menu-toggle{font-size:1.55rem}.nav-links{gap:15px}.nav-links a{font-size:.9rem}.hero{padding-left:15px;padding-right:15px}.hero h1{font-size:2.8rem}.hero h2{font-size:1.2rem}.project-card{padding:24px}}.weather-page{color:#6b3f4f;background:radial-gradient(circle at 50% 10%,#ffb6c173,#0000 45%),radial-gradient(circle at 10% 80%,#ffdae180,#0000 40%),#fff7fa;justify-content:center;align-items:center;min-height:100vh;padding:120px 20px 60px;display:flex}.weather-card{-webkit-backdrop-filter:blur(20px);text-align:center;background:#ffffffc7;border:1px solid #f4a7b973;border-radius:28px;width:min(100%,650px);padding:45px;box-shadow:0 25px 70px #be6e8729,0 0 35px #ffb6c11f}.weather-label{color:#c96f8d;letter-spacing:4px;margin-bottom:15px;font-size:.8rem}.weather-card h1{background:linear-gradient(90deg,#b85c7a,#e58da7,#f3a9bd);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 12px;padding:5px 0;font-size:clamp(2.5rem,7vw,4rem);line-height:1.2}.weather-subtitle{color:#9b6b7b;margin-bottom:30px}.weather-search{gap:10px;margin-bottom:25px;display:flex}.weather-search input{color:#704657;background:#fff7fae6;border:1px solid #e291a566;border-radius:12px;outline:none;flex:1;padding:14px 17px;font-size:1rem}.weather-search input::placeholder{color:#c18a9c}.weather-search input:focus{border-color:#e08da7;box-shadow:0 0 20px #e08da72e}.weather-search button{color:#fff9fb;cursor:pointer;background:linear-gradient(135deg,#e89ab2,#d97898);border:none;border-radius:12px;padding:0 22px;font-weight:600;transition:all .3s;box-shadow:0 8px 20px #d978982e}.weather-search button:hover{transform:translateY(-2px);box-shadow:0 10px 30px #d978984d}.weather-error{color:#c65f78;margin:15px 0}.weather-result{border-top:1px solid #e291a540;margin-top:30px;padding-top:30px}.location{color:#b5657f;font-size:1.1rem}.temperature{background:linear-gradient(135deg,#b85c7a,#e58da7,#f3b3c5);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:15px 0 10px;padding:8px 0;font-size:5rem;font-weight:800;line-height:1.25}.description{color:#8f6372;margin-bottom:30px;font-size:1.1rem}.weather-details{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.weather-details div{background:linear-gradient(145deg,#ffe0e8a6,#fff5f8cc);border:1px solid #e291a540;border-radius:15px;padding:18px 10px;transition:all .3s;box-shadow:0 8px 20px #be6e8712}.weather-details div:hover{border-color:#e08da773;transform:translateY(-3px);box-shadow:0 10px 25px #be6e871f}.weather-details span{color:#b58a99;margin-bottom:8px;font-size:.8rem;display:block}.weather-details strong{color:#8f5268}@media (width<=600px){.weather-page{padding:110px 15px 50px}.weather-card{border-radius:24px;padding:30px 20px}.weather-search{flex-direction:column}.weather-search button{padding:13px}.temperature{font-size:4rem}.weather-details{grid-template-columns:1fr}}.todo-page{color:#6b3f4f;background:radial-gradient(circle at 50% 10%,#ffb6c173,#0000 45%),radial-gradient(circle at 10% 80%,#ffdae180,#0000 40%),#fff7fa;justify-content:center;align-items:center;min-height:100vh;padding:100px 20px 60px;display:flex}.todo-card{-webkit-backdrop-filter:blur(20px);background:#fffc;border:1px solid #f4a7b973;border-radius:28px;width:min(100%,700px);padding:45px;box-shadow:0 25px 70px #be6e8729,0 0 35px #ffb6c11f}.todo-label{text-align:center;color:#c96f8d;letter-spacing:4px;margin-bottom:15px;font-size:.8rem}.todo-card h1{text-align:center;background:linear-gradient(90deg,#b85c7a,#e58da7,#f3a9bd);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 12px;padding:5px 0;font-size:clamp(2.5rem,7vw,4rem);line-height:1.2}.todo-subtitle{text-align:center;color:#9b6b7b;margin-bottom:30px}.todo-input-area{gap:10px;display:flex}.todo-input-area input{color:#704657;background:#fff7fae6;border:1px solid #e291a566;border-radius:12px;outline:none;flex:1;padding:15px 17px;font-size:1rem}.todo-input-area input::placeholder{color:#c18a9c}.todo-input-area input:focus{border-color:#e08da7;box-shadow:0 0 20px #e08da72e}.todo-input-area button{color:#fff9fb;cursor:pointer;background:linear-gradient(135deg,#e89ab2,#d97898);border:none;border-radius:12px;padding:0 22px;font-weight:600;transition:all .3s;box-shadow:0 8px 20px #d978982e}.todo-input-area button:hover{transform:translateY(-2px);box-shadow:0 10px 30px #d978984d}.todo-stats{color:#b5657f;justify-content:space-between;margin:25px 0 15px;padding:0 4px;font-size:.85rem;display:flex}.empty-state{text-align:center;color:#a77b8a;background:#ffeef459;border:1px dashed #e08da766;border-radius:18px;padding:45px 20px}.empty-state div{margin-bottom:10px;font-size:2rem}.empty-state p{color:#8f5268;margin-bottom:5px}.empty-state span{color:#b58a99;font-size:.85rem}.task-list{flex-direction:column;gap:12px;display:flex}.task-item{background:linear-gradient(145deg,#ffe0e8a6,#fff5f8cc);border:1px solid #e291a540;border-radius:14px;align-items:center;gap:14px;padding:15px;transition:all .3s;display:flex;box-shadow:0 6px 18px #be6e870f}.task-item:hover{border-color:#e08da773;transform:translate(3px);box-shadow:0 8px 22px #be6e871a}.check-button{color:#fff;cursor:pointer;background:0 0;border:1px solid #e08da78c;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:25px;height:25px;font-weight:700;transition:all .3s;display:flex}.completed .check-button{background:linear-gradient(135deg,#e89ab2,#d97898);border-color:#0000;box-shadow:0 5px 15px #d9789833}.task-text{color:#704657;flex:1;line-height:1.5}.completed .task-text{color:#b58a99;text-decoration:line-through}.delete-button{cursor:pointer;opacity:.65;background:0 0;border:none;font-size:1rem;transition:all .3s}.delete-button:hover{opacity:1;transform:scale(1.1)}@media (width<=600px){.todo-page{padding:100px 15px 50px}.todo-card{border-radius:24px;padding:30px 20px}.todo-input-area{flex-direction:column}.todo-input-area button{padding:13px}}.back-button{color:#b84f72!important;background:#fff0f5!important;border:1px solid #e8a0b8!important;box-shadow:0 8px 25px #d870932e!important}.back-button:hover{color:#a83f63!important;background:#ffdce8!important;border-color:#df7f9f!important;box-shadow:0 10px 30px #d8709340!important}
