*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:#1a1a2e;color:#e0e0e0;font-family:"Press Start 2P",monospace;overflow:hidden}#app{width:100vw;height:100vh}#mode-toggle,#lang-toggle{position:fixed;top:12px;z-index:100;background:#16213e;color:#e0e0e0;border:2px solid #e0e0e0;padding:6px 10px;font-family:"Press Start 2P",monospace;font-size:8px;cursor:pointer}#mode-toggle{right:12px}#lang-toggle{right:100px}#mode-toggle:hover,#lang-toggle:hover{background:#0f3460}.dialog-box{position:fixed;top:0;right:0;bottom:0;z-index:50;width:340px;max-width:90vw;background:#16213e;border-left:4px solid #e0e0e0;padding:24px 20px;overflow-y:auto;display:flex;flex-direction:column}.dialog-box.hidden{display:none}.dialog-inner{display:flex;flex-direction:column;gap:16px;flex:1}.dialog-spacer{flex:1}.dialog-image{width:100%;aspect-ratio:16 / 9;object-fit:cover;image-rendering:pixelated;border:2px solid #e0e0e0}.dialog-title{font-size:12px;color:#f0a500;margin-bottom:14px}.dialog-description{font-size:8px;line-height:2;margin-bottom:14px}.dialog-stack{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.stack-tag{background:#0f3460;border:1px solid #e0e0e0;padding:3px 7px;font-size:7px;font-family:"Press Start 2P",monospace}.dialog-links{display:flex;gap:14px;margin-bottom:14px}.dialog-links a,.project-links a{color:#f0a500;font-size:8px;text-decoration:none}.dialog-links a:hover,.project-links a:hover{text-decoration:underline}.dialog-close{background:transparent;border:2px solid #e0e0e0;color:#e0e0e0;font-family:"Press Start 2P",monospace;font-size:7px;padding:6px 10px;cursor:pointer}.dialog-close:hover{background:#0f3460}#classic-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#1a1a2e;overflow-y:auto}#classic-overlay.hidden{display:none}.classic-view{width:100%;min-height:100%;padding:60px 20px 20px}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;max-width:1200px;margin:0 auto}.project-card{background:#16213e;border:2px solid #e0e0e0;padding:16px;display:flex;flex-direction:column;gap:12px}.project-image{width:100%;aspect-ratio:16 / 9;object-fit:cover;image-rendering:pixelated;border:2px solid #e0e0e0}.project-card h2{font-size:10px;color:#f0a500}.project-description{font-size:7px;line-height:2;flex:1}.project-stack{display:flex;flex-wrap:wrap;gap:6px}.project-links{display:flex;gap:12px}@media(max-width:767px){body{overflow:auto}#app{height:auto;min-height:100vh}}