/*
 * engagement.css — shared styles for the engagement (lead-capture + reward) modal.
 * Loaded by all Gorton Solutions games. Theme tokens mirror the main site.
 */

.gs-eng-overlay{
  position:fixed;inset:0;z-index:10000;
  display:flex;align-items:center;justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.66);
  backdrop-filter:blur(6px);
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:#eaf0ff;
  animation:gsEngFade .22s ease both;
}
.gs-eng-overlay[hidden]{display:none}
@keyframes gsEngFade{from{opacity:0}to{opacity:1}}

.gs-eng-modal{
  width:min(440px,100%);
  background:rgba(17,26,51,.96);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 60px rgba(0,0,0,.6);
  padding:22px 22px 18px;
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
  position:relative;
}

.gs-eng-close{
  position:absolute;top:8px;right:8px;
  width:32px;height:32px;background:none;border:none;
  color:rgba(234,240,255,.6);font-size:18px;cursor:pointer;line-height:1;
}
.gs-eng-close:hover{color:#fff}

.gs-eng-badge{
  display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:#4ea3ff;border:1px solid rgba(78,163,255,.4);
  padding:3px 8px;margin-bottom:10px;
}

.gs-eng-title{
  margin:0 0 6px;font-size:20px;line-height:1.2;letter-spacing:-.01em;
}
.gs-eng-sub{
  margin:0 0 14px;font-size:13px;line-height:1.5;color:#a9b6dd;
}

.gs-eng-score{
  display:flex;align-items:baseline;gap:8px;
  margin:8px 0 14px;padding:10px 12px;
  background:rgba(78,163,255,.08);
  border:1px solid rgba(78,163,255,.22);
  border-left:3px solid rgba(78,163,255,.9);
}
.gs-eng-score__label{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#a9b6dd;font-family:ui-monospace,monospace}
.gs-eng-score__value{font-size:20px;font-weight:800;margin-left:auto}

.gs-eng-field{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.gs-eng-field label{font-size:12px;color:#a9b6dd}
.gs-eng-field input{
  width:100%;padding:11px 12px;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.16);
  color:#eaf0ff;font:inherit;font-size:14px;outline:none;
}
.gs-eng-field input:focus{
  border-color:rgba(78,163,255,.65);
  box-shadow:0 0 0 3px rgba(78,163,255,.15);
}
.gs-eng-field input[aria-invalid="true"]{border-color:#ff6b6b}

.gs-eng-consent{
  display:flex;gap:8px;align-items:flex-start;
  font-size:12px;color:#a9b6dd;margin:6px 0 14px;line-height:1.45;
}
.gs-eng-consent input{margin-top:2px;flex:0 0 auto}

.gs-eng-error{
  font-size:12px;color:#ff8a8a;margin:0 0 10px;min-height:16px;
}

.gs-eng-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.gs-eng-btn{
  flex:1;min-width:120px;
  padding:12px 14px;font:inherit;font-size:14px;font-weight:600;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:#eaf0ff;cursor:pointer;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
.gs-eng-btn:hover:not(:disabled){background:rgba(255,255,255,.12)}
.gs-eng-btn:disabled{opacity:.5;cursor:not-allowed}
.gs-eng-btn--primary{
  background:linear-gradient(135deg,rgba(78,163,255,.95),rgba(124,92,255,.95));
  border-color:rgba(255,255,255,.22);
}
.gs-eng-btn--primary:hover:not(:disabled){filter:brightness(1.08)}

.gs-eng-fine{font-size:11px;color:rgba(169,182,221,.8);margin:10px 0 0;line-height:1.45}

/* ── Reward screen ── */
.gs-eng-reward{text-align:center;padding:6px 0 4px}
.gs-eng-reward__icon{font-size:36px;margin-bottom:6px}
.gs-eng-reward__title{margin:0 0 4px;font-size:18px}
.gs-eng-reward__sub{margin:0 0 14px;font-size:13px;color:#a9b6dd}
.gs-eng-code{
  display:flex;align-items:center;gap:8px;
  background:rgba(0,0,0,.32);
  border:1px dashed rgba(78,163,255,.55);
  padding:12px 14px;margin:10px 0 6px;
}
.gs-eng-code__value{
  flex:1;font-family:ui-monospace,Consolas,monospace;
  font-size:18px;font-weight:700;letter-spacing:.08em;color:#7c5cff;
  word-break:break-all;text-align:left;
}
.gs-eng-code__copy{
  padding:8px 12px;background:rgba(78,163,255,.16);
  border:1px solid rgba(78,163,255,.4);color:#eaf0ff;cursor:pointer;font:inherit;font-size:13px;
}
.gs-eng-code__copy:hover{background:rgba(78,163,255,.26)}
.gs-eng-code__copy--copied{background:rgba(61,220,151,.18);border-color:rgba(61,220,151,.5)}

.gs-eng-expires{font-size:11px;color:rgba(169,182,221,.85);margin:0 0 12px}

@media(max-width:480px){
  .gs-eng-modal{padding:18px 16px 14px}
  .gs-eng-title{font-size:18px}
  .gs-eng-actions{flex-direction:column}
  .gs-eng-btn{width:100%}
}
