.gpg-container{
max-width:680px;
margin:30px auto;
padding:25px;
background:#fff;
border:1px solid #e5e5e5;
border-radius:14px;
box-shadow:0 8px 30px rgba(0,0,0,.06);
}
.gpg-field{margin-bottom:18px}
.gpg-field label{display:block;font-weight:600;margin-bottom:7px}
.gpg-field input,.gpg-field select{
width:100%;
box-sizing:border-box;
padding:12px 13px;
border:1px solid #ccc;
border-radius:8px;
font-size:16px;
}
.gpg-field small{display:block;margin-top:6px;color:#666}
#gpg-preview img{
display:block;
max-width:180px;
max-height:180px;
margin-top:12px;
border-radius:10px;
}
#gpg-submit{
width:100%;
padding:13px 18px;
border:0;
border-radius:8px;
cursor:pointer;
font-size:16px;
font-weight:600;
}
#gpg-submit:disabled{opacity:.6;cursor:wait}
#gpg-status{margin-top:15px;min-height:24px}
#gpg-status.success{color:#16803c}
#gpg-status.error{color:#b42318}
#gpg-result{margin-top:30px;text-align:center}
#gpg-result-image{
width:100%;
max-width:700px;
height:auto;
border-radius:12px;
display:block;
margin:0 auto 18px;
}
.gpg-download{
display:inline-block;
padding:11px 18px;
border-radius:8px;
text-decoration:none;
background:#222;
color:#fff;
}
.gpg-actions{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px;
margin-top:18px;
}
.gpg-share{
display:inline-block;
padding:11px 18px;
border:0;
border-radius:8px;
cursor:pointer;
font-weight:600;
}
.gpg-share-note{
margin-top:12px;
color:#666;
font-size:14px;
}
@media (max-width:520px){
.gpg-actions a,.gpg-actions button{
width:100%;
box-sizing:border-box;
}
}
@media (max-width: 800px) {
.gpg-recent-grid {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 600px) {
.gpg-recent-grid {
grid-template-columns: repeat(2, 1fr);
}
.gpg-recent-posters {
padding: 15px;
}
}
@media (max-width: 400px) {
.gpg-recent-grid {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
}
.gpg-recent-posters {
margin-top: 40px;
padding: 25px;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 14px;
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05);
}
.gpg-recent-posters h3 {
margin: 0 0 20px;
text-align: center;
font-size: 24px;
}
.gpg-recent-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 15px;
}
.gpg-recent-card {
overflow: hidden;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 10px;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.gpg-recent-card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}
.gpg-recent-card a {
display: block;
}
.gpg-recent-card img {
display: block;
width: 100%;
aspect-ratio: 4 / 5;
object-fit: cover;
}
.gpg-recent-info {
padding: 10px;
text-align: center;
}
.gpg-recent-info strong {
display: block;
font-size: 14px;
}
.gpg-recent-info span {
display: block;
margin-top: 3px;
color: #666;
font-size: 13px;
}