*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif;color:#333;line-height:1.6;min-height:100vh}#root{min-height:100vh;display:flex;flex-direction:column}header{padding:40px 20px;text-align:center;background:#fff;border-bottom:1px solid #e0e0e0}h1{font-size:20px;font-weight:400;letter-spacing:.5px;font-family:-apple-system,serif}h1 a{color:#333;text-decoration:none;transition:color .3s}h1 a:hover{color:#666}nav{margin-top:20px}nav a{color:#666;text-decoration:none;margin:0 6px;font-size:14px;transition:color .3s}nav a:hover{color:#000}nav a.active{color:#000;border-bottom:1px solid #000}.container{max-width:800px;margin:0 auto;padding:60px;flex:1;width:100%}.image-set{margin-bottom:80px;opacity:0;transform:translateY(20px);animation:fadeIn .6s forwards}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}.set-title{font-size:12px;font-weight:400;color:#666;margin-bottom:20px;letter-spacing:.5px}.images-grid{display:grid;gap:15px}.grid-1{grid-template-columns:1fr}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}.image-wrapper{position:relative;overflow:hidden;background:#e8e8e8;aspect-ratio:4/3;cursor:pointer;transition:transform .3s ease}.image-wrapper.square{aspect-ratio:1/1}.image-wrapper.natural{aspect-ratio:auto}.image-wrapper:hover,.website-screenshot img:hover{transform:scale(.98)}.image-wrapper img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .3s;background-color:#fff;padding:64px;border:8px solid black}.image-wrapper:hover img{opacity:.9}.cta-section{text-align:center;padding:60px 20px;margin-top:40px}.cta-section p{font-size:16px;color:#666;margin-bottom:20px}.cta-link{display:inline-block;padding:12px 30px;background:#000;color:#fff;text-decoration:none;font-size:14px;border-radius:4px;transition:background .3s}.cta-link:hover{background:#333}footer{text-align:center;padding:80px 20px;color:#999;font-size:11px;border-top:1px solid #e0e0e0;background:#fff}@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.container{padding:40px 15px}.image-set{margin-bottom:50px}.lightbox img{padding:32px!important;border:8px solid black!important}.lightbox-close{font-size:36px}}.text-content{max-width:700px;margin:0 auto;opacity:0;transform:translateY(20px);animation:fadeIn .6s forwards}.text-content h2{font-size:24px;font-weight:400;margin-bottom:30px;color:#000}.text-content h3{font-size:18px;font-weight:500;margin-top:40px;margin-bottom:15px;color:#333}.text-content p{margin-bottom:20px;font-size:14px;line-height:1.8;color:#555}.text-content a{color:#333;text-decoration:none;border-bottom:1px solid #999;transition:border-color .3s}.text-content a:hover{border-bottom-color:#000}.author-image{width:120px;height:120px;border-radius:50%;object-fit:cover;float:right;margin-left:30px;margin-bottom:20px}.contact-info{margin-top:40px}.contact-info p{margin-bottom:30px}.contact-info a{display:inline-block;margin-bottom:5px}.website-project{margin-bottom:60px;opacity:0;transform:translateY(20px);animation:fadeIn .6s forwards}.website-project-title{font-size:12px;font-weight:400;color:#666;margin-bottom:8px;letter-spacing:.5px;display:flex;justify-content:space-between;align-items:center}.website-project-title span{font-weight:400}.website-tagline{font-size:12px;color:#999;margin-bottom:15px;font-style:italic}.website-link{color:#999;text-decoration:none;font-size:12px;transition:color .3s;display:inline-flex;align-items:center;gap:4px}.website-link:hover{color:#333}.website-link:hover svg{stroke:#333}.external-icon{width:12px;height:12px;stroke:#999;stroke-width:2;fill:none;transition:stroke .3s}.website-screenshot{position:relative;overflow:hidden;background:#e8e8e8;cursor:pointer;transition:transform .3s ease;display:block}.website-screenshot img{width:100%;height:auto;display:block;transition:transform .3s ease,opacity .3s;padding:12px;border:1px dotted black}.website-screenshot:hover{transform:translateY(-5px)}.website-screenshot:hover img{opacity:.9}.book-item{margin-bottom:60px;opacity:0;transform:translateY(20px);animation:fadeIn .6s forwards}.book-content{display:flex;gap:40px;align-items:flex-start}.book-cover{flex-shrink:0;width:250px}.book-cover a{display:block;cursor:pointer;transition:transform .3s ease}.book-cover a:hover{transform:scale(.98)}.book-cover img{width:100%;height:auto;display:block;box-shadow:0 4px 12px #00000026;transition:opacity .3s;padding:12px;border:1px dotted black}.book-cover a:hover img{opacity:.9}.book-info h3{font-size:20px;font-weight:500;margin-bottom:10px;color:#000}.book-info .book-subtitle{font-size:14px;color:#666;margin-bottom:20px;font-style:italic}.book-info p{font-size:14px;line-height:1.8;color:#555;margin-bottom:15px}.book-link{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;background:#000;color:#fff;text-decoration:none;font-size:13px;border-radius:4px;transition:background .3s;margin-top:10px}.book-link:hover{background:#333}.book-link svg{stroke:#fff}@media(max-width:768px){.book-content{flex-direction:column}.book-cover{width:200px}}.lightbox{position:fixed;top:0;left:0;width:100%;height:100%;background:#f5f5f5;z-index:1000;display:flex;justify-content:center;align-items:center;padding:20px}.lightbox img{max-width:90%;max-height:90%;object-fit:contain;border:16px solid black;background-color:#fff;padding:128px}.lightbox-close{position:absolute;top:20px;right:30px;color:#000;font-size:28px;cursor:pointer;line-height:1;background:none;border:none}