@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#111713;--ink:#f9f7ee;--muted:#a6afa5;--gold:#d8b96e;--green:#b6ce9d;--line:#ffffff16}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px 'Cairo',Tahoma,Arial,sans-serif}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.preview{background:#d8b96e;color:#252a20;text-align:center;padding:7px 16px;font-size:11px;font-weight:700}header{max-width:1260px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 40px;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:13px;font-size:17px;font-weight:800}.brand img{width:68px;height:65px;object-fit:contain;background:white;border-radius:10px;padding:4px}.brand small{display:block;font-size:10px;color:var(--muted);font-weight:400;margin-top:3px}nav{display:flex;gap:7px}nav button{background:transparent;border:0;color:var(--muted);font-size:12px;padding:11px 14px;border-radius:7px}nav button.active{background:#ffffff0b;color:var(--gold)}.dh{width:75px;height:65px;object-fit:contain;background:#fff;border-radius:8px;padding:4px}main{max-width:1180px;margin:auto;padding:0 40px}.view{display:none}.view.active{display:block}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:85px;align-items:center;padding:75px 0 65px}.eyebrow{font-size:12px;color:var(--green);letter-spacing:.4px;display:flex;align-items:center;gap:8px}.eyebrow span{width:7px;height:7px;background:var(--green);border-radius:50%}h1{font-size:clamp(36px,4.5vw,61px);line-height:1.55;margin:20px 0;font-weight:900;letter-spacing:-1.8px}h1 em{font-style:normal;color:var(--gold)}.hero-copy>p{color:var(--muted);line-height:2.1;max-width:430px;font-size:14px}.prize{margin:26px 0;display:flex;align-items:center;gap:15px;flex-wrap:wrap}.prize span{font-size:12px;color:var(--gold)}.prize strong{font:800 58px Arial;color:var(--gold)}.prize small{font-size:10px;color:var(--muted);width:100%;margin-top:-12px}.steps{display:flex;gap:23px;padding-top:26px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.steps b{display:block;font:14px Arial;color:var(--gold);margin-bottom:9px}.claim-panel{background:#f7f6ed;color:#242d25;padding:33px;border-radius:20px;box-shadow:0 25px 100px #0003;position:relative}.claim-panel:before{content:'';position:absolute;inset:-13px 15px auto;height:40px;background:#d8b96e33;border:1px solid #d8b96e40;border-radius:20px;z-index:-1}.panel-top{display:flex;justify-content:space-between;align-items:center}.icon{font-size:36px;color:#9c7b32}.tag{font-size:10px;font-weight:700;border:1px solid #b5aa863f;padding:5px 12px;border-radius:40px;color:#8c713b}.claim-panel h2{font-size:23px;line-height:1.7;margin:18px 0 6px}.muted{font-size:12px;color:#6c746b;line-height:1.9}label{font-size:12px;font-weight:700;display:block;margin:22px 0 8px}input:not([type=checkbox]):not([type=file]){display:block;width:100%;padding:14px;border:1px solid #d7d9d0;border-radius:9px;background:#fff;color:#243126;margin-top:8px}#code{font:16px Arial;letter-spacing:2px;height:58px}.primary{background:#243c2c;color:#fff;border:0;border-radius:9px;padding:15px 20px;font-weight:700;width:100%;margin-top:17px;display:flex;align-items:center;justify-content:space-between}.primary:hover{background:#385640}.safe{border-top:1px solid #d7d9d0;margin-top:25px;padding-top:16px;font-size:10px;color:#767c71;text-align:center}.demo{margin-top:15px;color:#78806d;font-size:10px}.demo summary{cursor:pointer}.demo-codes{display:flex;gap:5px;margin:10px 0}.demo button{background:#e4e8dc;border:0;border-radius:5px;font-size:10px;padding:6px;color:#314031}.how{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:30px;padding:36px 0 50px;border-top:1px solid var(--line)}.how small,.section-heading>small{color:var(--gold);font-size:11px}.how h2{font-size:24px;line-height:1.8}.how article b{display:inline-grid;place-items:center;border:1px solid #d8b96e50;color:var(--gold);border-radius:50%;width:28px;height:28px;font-size:11px}.how h3{font-size:14px}.how p{font-size:11px;color:var(--muted);line-height:2}.faq{max-width:740px;margin:20px auto 65px}.faq h2{font-size:23px}.faq details{border-bottom:1px solid var(--line);padding:17px 0;font-size:12px}.faq summary{cursor:pointer}.faq p{color:var(--muted);line-height:2}footer{border-top:1px solid var(--line);text-align:center;padding:25px;color:var(--muted);font-size:11px}footer img{width:60px;height:52px;object-fit:contain;background:white;padding:3px;border-radius:6px}footer span{padding:0 10px;color:var(--gold)}footer small{font-size:10px}.section-heading{padding:45px 0 15px;text-align:center}.section-heading h1{font-size:38px;margin:10px 0}.section-heading p{color:var(--muted);font-size:12px;line-height:2;max-width:680px;margin:10px auto}.cards-grid{display:flex;justify-content:center;align-items:start;gap:35px;padding:25px 0}.ticket{width:310px;flex-shrink:0;border-radius:16px;background:radial-gradient(ellipse at top,#40553c,#12291c 72%);border:1px solid #d8b96e70;color:var(--gold);padding:22px;text-align:center;position:relative;box-shadow:0 16px 35px #0004;overflow:hidden}.ticket:before{content:'';position:absolute;inset:9px;border:1px solid #d8b96e35;border-radius:10px;pointer-events:none}.ticket-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.ticket-head img{width:68px;height:65px;object-fit:contain;background:white;border-radius:7px;padding:4px}.ticket-head span{font:8px Arial;letter-spacing:1.4px;max-width:120px;line-height:1.8}.ticket>p{font-size:10px;line-height:1.9}.ticket-value{font:900 62px Arial;letter-spacing:-3px;padding:10px 0 12px}.qr-wrap{background:white;padding:8px;border-radius:8px;width:110px;height:110px;margin:auto}.qr-wrap img{width:100%;height:100%}.ticket h2{font-size:23px;margin:13px 0 3px}.scratch{background:repeating-linear-gradient(120deg,#c7c9c4,#c7c9c4 3px,#d9dbd5 3px,#d9dbd5 5px);color:#5f645b;padding:14px 5px;border-radius:6px;font-size:10px;margin:17px 0 8px;border:1px dashed #eee}.ticket>small{font-size:8px;color:#c4cabb}.ticket-footer{display:flex;align-items:center;justify-content:center;gap:13px;border-top:1px solid #d8b96e30;margin-top:17px;padding-top:15px}.ticket-footer img{width:48px;height:42px;object-fit:contain;background:white;border-radius:4px}.ticket-footer span{font-size:9px;text-align:right;line-height:1.8}.loser{background:radial-gradient(ellipse at top,#333b32,#1a211b 72%);border-color:#76816d;color:#c1c9b8}.no-prize{background:#ffffff0b;color:#b5bdae;border:1px solid #ffffff20}.star{color:#a5b795}.card-note{text-align:center;font-size:11px;color:var(--muted);line-height:2;max-width:600px;margin:15px auto}.compact{width:auto;display:block;margin:20px auto 45px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:25px 0}.metrics>div{background:#ffffff06;border:1px solid var(--line);border-radius:12px;padding:24px}.metrics span{display:block;color:var(--muted);font-size:12px}.metrics strong{display:block;color:var(--gold);font:36px Arial;margin-top:14px}.admin-panel{background:#f7f6ed;color:#243126;border-radius:16px;padding:25px;margin:25px 0}.admin-panel h2{font-size:21px}.request{border-top:1px solid #dedfd5;padding:20px 0;font-size:12px;line-height:2}.request h3{margin:0}.badge{display:inline-block;border-radius:20px;padding:2px 10px;background:#ece1c2;color:#6a5424;font-size:10px}.badge.paid{background:#dde9d8;color:#2a5b2d}.request form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.request .primary{align-self:end}.request label{margin:5px 0}.text-button{background:none;color:var(--muted);border:0;text-decoration:underline;margin-bottom:45px}.message{padding:14px;background:#e2eadb;border-radius:8px;font-size:12px;margin-top:16px;line-height:2}.message.error{background:#f3dfd8;color:#8d3d2f}.message button{margin-top:8px}.error{color:#a23131;font-size:11px}dialog{border:0;border-radius:18px;padding:30px;width:min(92vw,480px);max-height:90vh;color:#27382a;background:#f7f6ed}dialog::backdrop{background:#09140ee0;backdrop-filter:blur(5px)}dialog h2{font-size:27px;margin:15px 0 0}dialog>p{font-size:12px;color:#757b6c}.close{position:absolute;left:15px;top:12px;border:0;background:none;font-size:26px;color:#65705c}.upload{border:1px dashed #b2b9a6;border-radius:9px;padding:15px}.upload input{width:100%;font-size:10px;margin-top:10px}.upload small{display:block;font-size:9px;color:#6c7563;margin-top:8px}.checkbox{display:flex;align-items:start;gap:8px;font-size:10px;line-height:1.9}.checkbox input{margin-top:5px}#photo-preview{max-width:100%;max-height:130px;border-radius:8px} .request img{max-height:120px;max-width:100%;display:block;margin:10px 0}
@media(max-width:800px){header{padding:17px 20px;flex-wrap:wrap;gap:15px}.brand{font-size:14px}.brand img{width:50px;height:49px}.dh{width:58px;height:50px}nav{order:3;width:100%;justify-content:center;border-top:1px solid var(--line);padding-top:10px}nav button{font-size:11px}main{padding:0 22px}.hero{grid-template-columns:1fr;gap:35px;padding:35px 0}.hero h1{font-size:42px}.hero-copy>p{max-width:100%}.hero-copy{max-width:580px}.prize{margin:18px 0}.claim-panel{padding:25px}.how{grid-template-columns:1fr;gap:10px;padding-top:30px}.how article{padding-right:45px;position:relative}.how article b{position:absolute;right:0;top:12px}.how h3{margin-bottom:0}.how p{margin-top:6px}.cards-grid{flex-wrap:wrap;gap:25px}.section-heading h1{font-size:29px}.metrics{gap:8px}.metrics>div{padding:15px}.metrics span{font-size:10px}.metrics strong{font-size:27px}.request form{grid-template-columns:1fr}.preview{font-size:9px}}
@media print{body{background:white}header,footer,.preview,.section-heading,.card-note,.compact,#claim,#admin{display:none!important}#cards{display:block!important;max-width:none;padding:0}.cards-grid{gap:15mm;padding:0}.ticket{box-shadow:none;print-color-adjust:exact;-webkit-print-color-adjust:exact;width:60mm;min-height:90mm;padding:4mm}.ticket-head img{width:12mm;height:12mm}.ticket-value{font-size:36px;padding:5px}.qr-wrap{width:22mm;height:22mm}.ticket h2{font-size:17px}.ticket p{font-size:8px}.scratch{padding:8px 3px}.ticket-footer{margin-top:8px;padding-top:8px}.ticket-head span{font-size:6px}.ticket-footer img{width:9mm;height:9mm}}

.win-banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  margin-bottom: 14px;
  border-radius: 12px;
  color: #24432a;
  background: #e7f1da;
}
.win-banner strong { font-size: 1.2rem; }
@media (prefers-reduced-motion: no-preference) {
  dialog[open] .win-banner { animation: prize-pop 420ms ease-out both; }
  @keyframes prize-pop {
    0% { opacity: 0; transform: scale(.9); }
    65% { opacity: 1; transform: scale(1.04); }
    100% { opacity: 1; transform: scale(1); }
  }
}

body.claim-complete { background: #fff; color: #202820; }
body.claim-complete > :not(#claim-confirmation) { display: none !important; }
#claim-confirmation[hidden] { display: none; }
#claim-confirmation {
  max-width: 42rem;
  min-height: 100vh;
  margin: 0 auto;
  padding: clamp(2.5rem, 10vh, 6rem) 1.25rem 3rem;
  text-align: center;
}
#claim-confirmation h1 {
  color: #202820;
  font-size: clamp(1.7rem, 6vw, 2.7rem);
  line-height: 1.35;
}
.confirmation-check {
  display: grid;
  place-items: center;
  margin: 0 auto 1.25rem;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 50%;
  background: #e7f1da;
  color: #28553b;
  font-size: 2rem;
}
.confirmation-status { font-weight: bold; color: #28553b; }
.confirmation-reference {
  display: grid;
  gap: .5rem;
  margin: 1.75rem auto 0;
  padding: 1rem;
  background: #f3f6f1;
  border-radius: .75rem;
  overflow-wrap: anywhere;
}

.payment-receipt { margin: 1rem 0 0; }
.payment-receipt figcaption { font-weight: bold; margin-bottom: .5rem; }
.payment-receipt img { display: block; width: auto; max-width: 100%; max-height: 65vh; object-fit: contain; border-radius: .5rem; }