*{box-sizing:border-box}body,html{background-color:#fff;color:#000;font-family:Inter,sans-serif;margin:0;overflow:hidden;padding:0;-webkit-user-select:none;user-select:none}#root,body,html{height:100%;width:100%}.preview-backdrop{align-items:center;background:#00000040;display:flex;inset:0;justify-content:center;padding:24px;position:fixed;z-index:9998}.preview-card{background:#fff;background:var(--peek-bg,#fff);border:1px solid #0000001f;border:1px solid var(--peek-border,#0000001f);border-radius:20px;box-shadow:0 20px 60px #0000002e,0 8px 20px #00000014,0 0 0 1px #0000000a;cursor:grab;max-height:min(80vh,600px);outline:none;overflow-y:auto;padding:1.75rem;-webkit-user-select:none;user-select:none;width:min(480px,calc(100vw - 32px));z-index:9999}.preview-card:active{cursor:grabbing}.preview-card-content{pointer-events:none}.preview-card-content a,.preview-card-content button{pointer-events:auto}.preview-header{flex-wrap:wrap;justify-content:space-between;margin-bottom:.75rem}.preview-header,.preview-title{align-items:center;display:flex;gap:.5rem}.preview-title{color:#111;color:var(--peek-title,#111);font-size:1.4rem;font-weight:700}.preview-meta{align-items:center;color:#666;color:var(--peek-meta,#666);display:flex;font-size:.85rem;gap:.75rem}.preview-kind{background:#6a0dad1f;border:1px solid #6a0dad33;border-radius:999px;color:#6a0dad;font-size:.7rem;font-weight:600;letter-spacing:.03em;padding:2px 10px;text-transform:uppercase}.preview-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:.75rem 0}.preview-tag{align-items:center;background:#f0f0f0;background:var(--peek-tag-bg,#f0f0f0);border:1px solid #ddd;border:1px solid var(--peek-tag-border,#ddd);border-radius:10px;color:#444;color:var(--peek-tag-color,#444);display:flex;font-size:.75rem;gap:.3rem;padding:.2rem .65rem}.preview-desc{margin:.75rem 0}.preview-desc ul{margin:0;padding-left:1.1rem}.preview-desc li{color:#444;color:var(--peek-desc,#444);font-size:.92rem;line-height:1.55;margin-bottom:.35rem}.preview-link{align-items:center;background:#6a0dad;border-radius:10px;color:#fff;display:inline-flex;font-size:.85rem;font-weight:600;gap:.4rem;margin-top:1rem;padding:.5rem 1rem;text-decoration:none;transition:background .2s ease}.preview-link:hover{background:#5510a0}.preview-dismiss-hint{color:#999;color:var(--peek-meta,#999);font-size:.72rem;margin-top:1rem;opacity:.7;text-align:center}@media (max-width:520px){.preview-card{border-radius:16px;max-height:70vh;padding:1.25rem;width:calc(100vw - 24px)}.preview-title{font-size:1.2rem}.preview-desc li{font-size:.85rem}}body.dark-mode .preview-backdrop{background:#0000008c}body.dark-mode .preview-card{box-shadow:0 20px 60px #0006,0 8px 20px #0003,0 0 0 1px #ffffff0a}.dark-mode-toggle{align-items:center;background:#f0f0f0;background:var(--toggle-bg,#f0f0f0);border:none;border-radius:50%;box-shadow:0 2px 10px #0003;color:#333;color:var(--toggle-color,#333);cursor:pointer;display:flex;font-size:1.2rem;height:50px;justify-content:center;position:fixed;right:20px;top:20px;transition:all .3s ease;width:50px;z-index:1000}.dark-mode-toggle:hover{box-shadow:0 4px 15px #0000004d;transform:scale(1.1)}.light{--toggle-bg:#f0f0f0;--toggle-color:#333}.dark{--toggle-bg:#333;--toggle-color:#f0f0f0}.section{display:flex;flex-direction:column;justify-content:center;margin-bottom:100px;min-height:100vh;padding-left:10%;padding-right:10%}#canvas-container{height:100vh;left:0;pointer-events:none;position:fixed;top:0;width:100vw}#canvas-container,#canvas-container canvas{touch-action:pan-y}.interface{position:relative;width:100%;z-index:10}h1{font-size:5rem;margin:0}h1,h2{color:#000}h2{font-size:3rem;margin-bottom:1rem}p{color:#333;font-size:1.2rem;line-height:1.5;max-width:500px}.skill-list{display:flex;flex-wrap:wrap;gap:1rem;max-width:600px}.skill-badge{align-items:center;background:#fff;border:1px solid #000;border-radius:10px;box-shadow:0 2px 5px #0000001a;cursor:default;display:flex;font-weight:700;gap:.5rem;padding:.75rem 1.25rem;transition:all .3s ease-in-out}.skill-badge:hover{background:#f0f0f0;box-shadow:0 5px 15px #0003;transform:translateY(-3px)}.skill-badge span.logo{align-items:center;color:#000;display:flex;font-size:1.2rem;line-height:1}.project-card{background:#fff;border:1px solid #000;border-radius:16px;box-shadow:0 4px 8px #0000001a;margin-bottom:1.5rem;max-width:700px;padding:1.5rem;transition:all .3s ease}.project-card:hover{background:#fafafa;border-color:#333;box-shadow:0 10px 25px #00000026;transform:translateY(-5px)}.project-header{align-items:baseline;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:space-between;margin-bottom:.5rem}.project-title{color:#000;font-size:1.5rem;font-weight:700;gap:.5rem}.project-date,.project-title{align-items:center;display:flex}.project-date{color:#666;font-size:.9rem;gap:.3rem}.project-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:.8rem 0}.project-tag{background:#f0f0f0;border:1px solid #ccc;border-radius:12px;color:#333;font-size:.8rem;padding:.2rem .6rem}.project-desc ul{color:#333;margin:.5rem 0;padding-left:1.2rem}.project-desc li{margin-bottom:.4rem}@media (max-width:1200px){.section{padding-left:5%;padding-right:5%}h1{font-size:4rem}h2{font-size:2.5rem}p{font-size:1.1rem}.project-card,p{max-width:100%}}@media (max-width:768px){.section{min-height:auto;padding:100px 5% 50px}h1{font-size:3rem}h2{font-size:2rem}p{font-size:1rem}.skill-list{max-width:100%}.project-header{align-items:flex-start;flex-direction:column;gap:.5rem}.project-title{font-size:1.3rem}.skill-badge{font-size:.9rem;padding:.5rem .8rem}}@media (max-width:480px){h1{font-size:2.5rem}h2{font-size:1.8rem}.skill-badge{font-size:.8rem;padding:.4rem .6rem}.project-card{padding:1rem}.project-title{font-size:1.2rem}}@media (hover:none) and (pointer:coarse){.project-card:hover,.skill-badge:hover{box-shadow:0 4px 8px #0000001a;transform:none}}:root{--bg-color:#fff;--text-color:#000;--section-bg:#0000;--skill-bg:#ffffffd9;--skill-border:#000;--skill-color:#000;--project-bg:#ffffffd9;--project-border:#000;--project-color:#333;--project-tag-bg:#f0f0f0e6;--project-tag-color:#333;--project-tag-border:#ccc;--project-date-color:#666;--peek-bg:#fff;--peek-border:#0000001f;--peek-title:#111;--peek-meta:#666;--peek-tag-bg:#f0f0f0;--peek-tag-color:#444;--peek-tag-border:#ddd;--peek-desc:#444}body.dark-mode{--bg-color:#121212;--text-color:#e0e0e0;--section-bg:#0000;--skill-bg:#1e1e1ed9;--skill-border:#444;--skill-color:#e0e0e0;--project-bg:#1e1e1ed9;--project-border:#444;--project-color:#e0e0e0;--project-tag-bg:#2a2a2ae6;--project-tag-color:#e0e0e0;--project-tag-border:#555;--project-date-color:#999;--peek-bg:#1c1c1efa;--peek-border:#ffffff1a;--peek-title:#f0f0f0;--peek-meta:#aaa;--peek-tag-bg:#3c3c3ccc;--peek-tag-color:#ccc;--peek-tag-border:#ffffff14;--peek-desc:#ccc}body{background-color:#fff;background-color:var(--bg-color);color:#000;color:var(--text-color);transition:background-color .3s ease,color .3s ease}body.dark-mode .section{background-color:initial;background-color:var(--section-bg)}body.dark-mode h1,body.dark-mode h2{color:#000;color:var(--text-color)}body.dark-mode p{color:#333;color:var(--project-color)}body.dark-mode .project-title{color:#000;color:var(--text-color)}body.dark-mode .skill-badge{background:#ffffffd9;background:var(--skill-bg);border-color:#000;border-color:var(--skill-border);color:#000;color:var(--skill-color)}body.dark-mode .skill-badge:hover{background:#2a2a2ae6}body.dark-mode .project-card{background:#ffffffd9;background:var(--project-bg);border-color:#000;border-color:var(--project-border);color:#333;color:var(--project-color)}body.dark-mode .project-card:hover{background:#2a2a2ae6;border-color:#666}body.dark-mode .project-tag{background:#f0f0f0e6;background:var(--project-tag-bg);border-color:#ccc;border-color:var(--project-tag-border);color:#333;color:var(--project-tag-color)}body.dark-mode .project-date{color:#666;color:var(--project-date-color)}body.dark-mode .project-desc,body.dark-mode .project-desc li{color:#fff}.contact-link{transition:all .3s ease}.contact-link:hover{box-shadow:0 5px 15px #0000001a;transform:translateY(-3px)}::-webkit-scrollbar{display:none}html{scrollbar-width:none}body{-ms-overflow-style:none}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}