@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";
:root{--bg:#111;--text:#fff;--text-secondary:#ccc;--card-bg:#1f1f1f;--card-shadow:rgba(0,0,0,.2)}body.light{--bg:#fff;--text:#111;--text-secondary:#555;--card-bg:#f5f5f5;--card-shadow:rgba(0,0,0,.1)}html,body{background-color:var(--bg);color:var(--text);margin:0;font-family:Inter,sans-serif;transition:all .3s}nav{color:var(--text);z-index:100;background:0 0;justify-content:space-between;align-items:center;padding:1rem 2rem;transition:all .3s;display:flex;position:-webkit-sticky;position:sticky;top:0}header{text-align:center;min-height:60vh;color:var(--text);background:linear-gradient(135deg,#1f1f1f,#3a3a3a);flex-direction:column;justify-content:center;align-items:center;transition:all .3s;display:flex}body.light header{background:linear-gradient(135deg,#f0f0f0,#fff)}header p{color:var(--text-secondary)}.project-card{background-color:var(--card-bg);width:300px;color:var(--text);box-shadow:0 10px 25px var(--card-shadow);border-radius:12px;margin:1rem;padding:1.5rem;transition:all .3s}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;background:0 0;border:none;font-size:1rem}