*,:before,:after{box-sizing:border-box}:root{color:#333;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f8f8f8;font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5}body{margin:0}#root{min-height:100vh}img{max-width:100%}button{font-family:inherit}.project-card{cursor:pointer;background:#fff;border-radius:10px;transition:transform .18s,box-shadow .18s;overflow:hidden;box-shadow:0 2px 8px #00000014}.project-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #00000024}.project-card__image-wrap{aspect-ratio:4/3;position:relative;overflow:hidden}.project-card__image-wrap img{object-fit:cover;width:100%;height:100%;transition:transform .3s;display:block}.project-card:hover .project-card__image-wrap img{transform:scale(1.04)}.project-card__count{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;border-radius:20px;padding:3px 8px;font-size:.75rem;position:absolute;bottom:8px;right:10px}.project-card__body{padding:14px 16px 18px}.project-card__body h3{color:#111;margin:0 0 6px;font-size:1rem;font-weight:600}.project-card__body p{color:#555;margin:0;font-size:.875rem;line-height:1.45}.home-page{max-width:1200px;margin:0 auto;padding:40px 24px 80px}.home-page__header{margin-bottom:48px}.home-page__header h1{color:#111;margin:0 0 10px;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700}.home-page__header p{color:#666;margin:0;font-size:1.05rem}.home-page__group{margin-bottom:56px}.home-page__group-title{color:#333;border-bottom:2px solid #e5e7eb;margin:0 0 20px;padding-bottom:10px;font-size:1.25rem;font-weight:600}.home-page__grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;display:grid}.photo-viewer{flex-direction:column;gap:12px;display:flex}.photo-viewer__stage{align-items:center;gap:12px;display:flex}.photo-viewer__frame{background:#111;border-radius:8px;flex:1;justify-content:center;align-items:center;height:clamp(320px,55vh,680px);display:flex;position:relative;overflow:hidden}.photo-viewer__frame img{object-fit:contain;max-width:100%;max-height:100%;animation:.2s fadeIn;display:block}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.photo-viewer__caption{color:#fff;background:linear-gradient(#0000,#000000a6);padding:10px 14px;font-size:.875rem;position:absolute;bottom:0;left:0;right:0}.pv-nav{cursor:pointer;color:#222;-webkit-user-select:none;user-select:none;background:#fff;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.75rem;line-height:1;transition:background .15s,transform .1s;display:flex;box-shadow:0 2px 8px #0000002e}.pv-nav:hover{background:#f0f0f0;transform:scale(1.08)}.pv-nav:active{transform:scale(.96)}.photo-viewer__counter{text-align:center;color:#888;letter-spacing:.04em;font-size:.8rem}.photo-viewer__thumbs{scrollbar-width:thin;scrollbar-color:#ccc transparent;gap:8px;padding:4px 2px 8px;display:flex;overflow-x:auto}.photo-viewer__thumbs::-webkit-scrollbar{height:4px}.photo-viewer__thumbs::-webkit-scrollbar-thumb{background:#ccc;border-radius:2px}.thumb{cursor:pointer;opacity:.65;background:0 0;border:2px solid #0000;border-radius:5px;flex-shrink:0;width:80px;height:56px;padding:0;transition:border-color .15s,opacity .15s;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.thumb:hover{opacity:.85}.thumb--active{opacity:1;border-color:#3b82f6}.project-page{max-width:1100px;margin:0 auto;padding:32px 24px 80px}.project-page--not-found{color:#666;flex-direction:column;align-items:center;gap:16px;padding-top:80px;display:flex}.project-page__back{color:#3b82f6;cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;margin-bottom:24px;padding:0;font-size:.9rem;transition:color .15s;display:inline-flex}.project-page__back:hover{color:#1d4ed8}.project-page__header{margin-bottom:28px}.project-page__type{text-transform:uppercase;letter-spacing:.08em;color:#3b82f6;background:#eff6ff;border-radius:20px;margin-bottom:10px;padding:3px 10px;font-size:.78rem;font-weight:600;display:inline-block}.project-page__header h1{color:#111;margin:0 0 8px;font-size:clamp(1.5rem,3.5vw,2.2rem);font-weight:700}.project-page__header p{color:#555;max-width:680px;margin:0;font-size:1rem}.project-page__details{flex-direction:column;gap:12px;max-width:680px;margin-bottom:32px;display:flex}.project-page__details p{color:#444;margin:0;font-size:1rem;line-height:1.7}.site-footer{text-align:center;border-top:1px solid #e5e7eb;margin-top:auto;padding:24px}.site-footer p{color:#aaa;margin:0;font-size:.8rem}.app-layout{flex-direction:column;min-height:100vh;display:flex}