: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}html,body{margin:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:#eaeaea}#overlay{position:fixed;top:40px;width:100%;text-align:center;z-index:1;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}#overlay button{margin-top:1.25rem;padding:12px;font-size:1rem;font-weight:500;color:#fff;background:#ffffff1f;border:1px solid rgba(255,255,255,.25);border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:pointer;transition:transform .2s ease,box-shadow .25s ease,border-color .25s ease}#overlay button:hover{background:#ffffff38;border-color:#ffffff80;box-shadow:0 8px 28px #00000059,0 0 12px #ffffff40;transform:translateY(-2px) scale(1.05)}#canvas{background-color:#90cce1;display:block}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1000;opacity:0;transition:opacity .3s ease}.modal.active{display:flex;align-items:center;justify-content:center;opacity:1}.modal-content{background:#ffffff26;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.3);border-radius:24px;padding:40px;max-width:800px;width:90%;max-height:85vh;overflow-y:auto;position:relative;box-shadow:0 8px 32px #0000004d;transform:scale(.9);transition:transform .3s ease}.modal.active .modal-content{transform:scale(1)}.modal-content::-webkit-scrollbar{width:8px}.modal-content::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}.modal-content::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:10px}.close-btn{position:absolute;top:20px;right:20px;background:#ffffff26;border:1px solid rgba(255,255,255,.25);color:#fff;font-size:28px;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.close-btn:hover{background:#ffffff40;transform:rotate(90deg)}.portfolio-header{text-align:center;margin-bottom:40px;color:#fff}.portfolio-header h2{font-size:2.5rem;margin-bottom:8px;font-weight:600}.portfolio-header p{color:#fffc;font-size:1.1rem}.projects-grid{display:grid;gap:20px}.project-card{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:24px;transition:all .3s ease;cursor:pointer;margin-top:16px}.project-card:hover{background:#ffffff26;transform:translateY(-4px);box-shadow:0 12px 24px #0003}.project-number{color:#ffffff80;font-size:.9rem;font-weight:600;margin-bottom:12px}.project-card h3{color:#fff;font-size:1.4rem;margin-bottom:12px;font-weight:600}.project-card p{color:#fffc;line-height:1.6;margin-bottom:16px}.tech-stack{display:flex;flex-wrap:wrap;gap:8px}.tech-stack span{background:#ffffff26;border:1px solid rgba(255,255,255,.25);color:#fff;padding:6px 12px;border-radius:999px;font-size:.85rem;font-weight:500}@media(max-width:768px){.modal-content{padding:30px 20px}.portfolio-header h2{font-size:2rem}.project-card{padding:20px}}