.gog-gift-fields{
  --gog-accent:#0C3E5C;
  --gog-text:#263746;
  --gog-muted:#6e7b86;
  --gog-line:#dfe6eb;
  margin:24px 0 20px;
  padding:22px;
  border:1px solid var(--gog-line);
  border-radius:16px;
  background:#f7f9fa;
  color:var(--gog-text);
  font-family:inherit;
}
.gog-gift-fields *{box-sizing:border-box}
.gog-gift-fields__title{
  margin:0 0 16px;
  color:var(--gog-accent);
  font-size:18px;
  line-height:1.2;
  font-weight:800;
}
.gog-gift-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.gog-gift-fields .form-row{
  margin:0 0 14px !important;
  padding:0 !important;
}
.gog-gift-fields label{
  display:block;
  margin-bottom:6px;
  color:var(--gog-text);
  font-size:14px;
  font-weight:700;
}
.gog-gift-fields .optional{
  color:var(--gog-muted);
  font-weight:500;
}
.gog-gift-fields input,
.gog-gift-fields textarea{
  width:100% !important;
  min-height:46px;
  padding:11px 13px !important;
  border:1px solid #ccd8df !important;
  border-radius:10px !important;
  background:#fff !important;
  color:var(--gog-text) !important;
  font:inherit !important;
  box-shadow:none !important;
}
.gog-gift-fields textarea{
  min-height:88px;
  resize:vertical;
}
.gog-gift-fields input:focus,
.gog-gift-fields textarea:focus{
  outline:none !important;
  border-color:var(--gog-accent) !important;
  box-shadow:0 0 0 3px rgba(12,62,92,.10) !important;
}
.gog-gift-fields small{
  display:block;
  margin-top:6px;
  color:var(--gog-muted);
  font-size:12px;
  line-height:1.45;
}
@media(max-width:620px){
  .gog-gift-grid{grid-template-columns:1fr}
  .gog-gift-fields{padding:18px 15px}
}

/* Live preview */
.gog-gift-preview-section{
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--gog-line);
}
.gog-gift-preview-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.gog-gift-preview-label{
  color:var(--gog-accent);
  font-size:15px;
  font-weight:800;
}
.gog-gift-live-preview{
  position:relative;
  width:min(88vw, 760px);
  max-width:760px;
  aspect-ratio:1055 / 1491;
  margin:0 auto;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--gog-line);
  border-radius:12px;
  box-shadow:0 12px 32px rgba(12,62,92,.10);
  color:#173E59;
  container-type:inline-size;
}
@media(min-width:768px){
  .gog-gift-live-preview{
    margin-left:50%;
    transform:translateX(-50%);
  }
}
.gog-gift-live-preview__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
}
.gog-preview-field{
  position:absolute;
  z-index:2;
  left:50%;
  transform:translateX(-50%);
  width:62%;
  font-family:Arial,Helvetica,sans-serif;
  color:#173E59;
  text-align:center;
}

.gog-preview-field__label{
  display:block;
  margin:0 0 .55em;
  color:#0C3E5C;
  font-size:1.55cqw;
  line-height:1;
  font-weight:700;
  letter-spacing:.055em;
}
.gog-preview-field__value{
  display:block;
  min-height:1.2em;
  margin:0;
  color:#173E59;
  font-size:2.65cqw;
  line-height:1.22;
  font-weight:400;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gog-preview-field__value--strong{
  font-size:3.35cqw;
  line-height:1.16;
  font-weight:800;
}
.gog-preview-field__value--message{
  white-space:pre-wrap;
  overflow:hidden;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp:3;
  max-height:3.75em;
}
.gog-preview-field__value--code{
  color:#536E80;
  font-size:1.85cqw;
}
.gog-preview-field__line{display:none}

/* These vertical positions mirror the PDF layout. Font sizes above use
   container-query units, so the whole certificate scales as one design
   instead of text staying huge when the preview is shown in a narrow column. */
.gog-preview-recipient{top:37.8%}
.gog-preview-from{top:43.6%}
.gog-preview-value{top:49.8%}
.gog-preview-message{top:58.8%}
.gog-preview-expiry{top:70.6%}
.gog-preview-code{top:76.0%}

.gog-preview-footer{
  position:absolute;
  z-index:2;
  left:12%;
  top:82.6%;
  width:54%;
  margin:0;
  color:#ffffff;
  font-family:Arial,Helvetica,sans-serif;
  font-size:1.48cqw;
  line-height:1.38;
  text-align:left;
}
.gog-preview-footer strong{font-weight:700;color:#ffffff}

.gog-gift-preview-note{
  margin-top:10px;
  color:var(--gog-muted);
  font-size:12px;
  line-height:1.4;
}
@media(max-width:620px){
  .gog-gift-live-preview{border-radius:9px}
}