/* Deferred CSS - некритичные стили */
.logo:hover{color:var(--primary)}
header{box-shadow:0 2px 4px rgba(0,0,0,.05)}
.grid img{cursor:pointer;transition:transform .3s ease}
.grid img:hover{transform:scale(1.05)}
.sidebar a:hover{color:#0052a3;text-decoration:underline}
.surprise-link{display:inline-block;margin-top:var(--gap);padding:10px 20px;background:var(--primary);color:#fff!important;font-weight:600;border-radius:var(--radius);text-decoration:none!important;transition:background .2s}
.surprise-link:hover{background:#0052a3}
.ad-block{margin:var(--gap) 0;padding:15px;background:var(--bg);border-radius:var(--radius);text-align:center;min-height:100px;display:flex;align-items:center;justify-content:center}
.static-content{max-width:900px;margin:0 auto}
.static-page-content{line-height:1.8}
.static-page-content h2{margin-top:30px;margin-bottom:15px;font-size:1.5rem;color:#222;font-weight:600}
.static-page-content h3{margin-top:25px;margin-bottom:12px;font-size:1.25rem;color:#333;font-weight:600}
.static-page-content ol,.static-page-content ul{margin-left:25px;margin-bottom:15px}
.static-page-content li{margin-bottom:8px}
.static-page-content p{margin-bottom:15px}
.static-page-content a{color:var(--primary);text-decoration:underline}
footer a:hover{color:var(--primary);text-decoration:underline}
@media(max-width:1024px){:root{--gap:15px}.content-wrapper{grid-template-columns:1fr 250px;gap:20px}}
@media(max-width:768px){:root{--gap:12px;--header-h:50px}.logo{font-size:1.25rem}.sidebar{margin-top:var(--gap)}.footer-links{flex-direction:column;gap:10px}}
@media(max-width:480px){:root{--gap:10px}h1{font-size:1.5rem}.grid td{padding:10px}.sidebar{padding:15px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media print{header,.sidebar,.ad-block,footer{display:none}.content-wrapper{grid-template-columns:1fr}}

/* Modal */
.modal{display:none;position:fixed;z-index:10000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.95)}
.modal.active{display:flex;align-items:center;justify-content:center;animation:fadeIn .3s}
.modal-content{max-width:95%;max-height:95%;object-fit:contain;animation:zoomIn .3s;border-radius:4px}
.modal-close{position:absolute;top:15px;right:25px;color:#fff;font-size:45px;font-weight:300;cursor:pointer;line-height:1;z-index:10001}
.modal-close:hover{color:#bbb}
.modal-nav{position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-size:50px;font-weight:300;cursor:pointer;padding:20px;user-select:none;z-index:10001}
.modal-nav:hover{color:#bbb}
.modal-prev{left:10px}
.modal-next{right:10px}
.modal-counter{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:#fff;font-size:16px;background:rgba(0,0,0,.5);padding:8px 16px;border-radius:20px;z-index:10001}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes zoomIn{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:768px){.modal-close{font-size:35px;top:10px;right:15px}.modal-nav{font-size:40px;padding:15px}.modal-prev{left:5px}.modal-next{right:5px}}
