#tm-pwa-overlay {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 60%; max-width: none; background: rgba(0, 0, 0, 0); z-index: 9999;
pointer-events: auto;
} #tm-pwa-overlay .tm-pwa-window {
background: #fff;
width: 100%; max-width: 100%;
max-height: 90vh;
display: flex;
flex-direction: column;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
position: relative;
pointer-events: auto;
} .tm-pwa-header {
background: #f5f5f5;
padding: 12px 16px;
display: flex;
justify-content: space-between;
align-items: center;
font-family: sans-serif;
font-size: 0.95rem;
border-bottom: 1px solid #ddd;
}
.tm-pwa-header .tm-pwa-url {
color: inherit;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
margin-right: 12px;
} .tm-pwa-close {
position: absolute;
top: 12px;
right: 12px;
color: default !important;
border: none;
outline: none;
font-size: 38px;
width: 36px;
height: 36px;
border-radius: 0; padding: 0;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
transition: background 0.2s ease;
} .tm-pwa-content {
flex: 1;
overflow-y: auto;
padding: 20px;
box-sizing: border-box;
} .tm-pwa-content img,
.tm-pwa-content video,
.tm-pwa-content iframe {
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
display: block;
border-radius: 6px;
height: auto; border: 0; } .tm-project-meta>div {
display: flex;
flex-direction: column;
margin-bottom: 20px;
}
.tm-project-meta>div strong {
display: block;
margin-bottom: 5px;
} .tm-pwa-content::-webkit-scrollbar {
width: 8px;
}
.tm-pwa-content::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.3);
border-radius: 4px;
}
.tm-pwa-content::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.05);
} .tm-pwa-gallery-prev,
.tm-pwa-gallery-next {
position: absolute;
top: 50%;
transform: translateY(-50%);
color: #fff !important;
background: none !important;
border: none !important;
outline: none !important;
box-shadow: none !important;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
font-size: 42px;
width: auto;
height: auto;
padding: 0 12px;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
transition: none;
}
.tm-pwa-gallery-prev {
left: 12px;
}
.tm-pwa-gallery-next {
right: 12px;
} @media (min-width: 641px) and (max-width: 1300px) {
#tm-pwa-overlay {
width: 100%;
max-width: 1300px; padding: 0 20px; transform: none;
top: 0;
left: 0;
}
#tm-pwa-overlay .tm-pwa-window {
width: 100%;
max-width: 100%;
} .tm-pwa-content img,
.tm-pwa-content video,
.tm-pwa-content iframe {
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
display: block;
border-radius: 6px;
height: auto; border: 0;
}
} @media (max-width: 640px) {
#tm-pwa-overlay {
top: 0;
left: 0;
transform: none;
width: 100%;
padding: 10px;
}
#tm-pwa-overlay .tm-pwa-window {
width: 100%;
max-width: 100%;
} .tm-pwa-content img,
.tm-pwa-content video,
.tm-pwa-content iframe {
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
display: block;
border-radius: 4px; height: auto;
border: 0;
}
}