@font-face{font-family:'Oxygen';src:url('/assets/fonts/Oxygen-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Oxygen';src:url('/assets/fonts/Oxygen-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Oxygen','Segoe UI',Tahoma,sans-serif;min-height:100vh;display:flex;
 align-items:center;justify-content:center;padding:28px;color:#fff;text-align:center;
 overflow:hidden;position:relative;
 background:#2a1810}
.bgwrap{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none;transform:translateZ(0)}
.bgwrap::before{content:"";position:absolute;inset:-12%;
 background:url("/assets/bg.jpg") center/cover no-repeat;
 animation:bgmove 20s ease-in-out infinite alternate;will-change:transform}
.bgwrap::after{content:"";position:absolute;inset:0;
 background:radial-gradient(120% 80% at 50% 0%,rgba(212,160,84,.22),transparent 62%),
 linear-gradient(90deg,transparent 45%,rgba(22,11,6,.55) 100%),
 linear-gradient(165deg,rgba(61,37,25,.72) 0%,rgba(42,24,16,.80) 55%,rgba(22,11,6,.90) 100%)}
@keyframes bgmove{0%{transform:scale(1) translate(0,0)}
 50%{transform:scale(1.22) translate(-6%,-4%)}
 100%{transform:scale(1.12) translate(6%,4%)}}
@media (prefers-reduced-motion:reduce){.bgwrap::before{animation:none}}
.stars{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:1;transform:translateZ(0);will-change:transform}
.stars i{position:absolute;width:1.5px;height:1.5px;border-radius:50%;background:#f0d9b0;opacity:.22;
 animation:twinkle var(--d) ease-in-out infinite var(--dl)}
.stars i.big{width:2px;height:2px}
@keyframes twinkle{0%,100%{opacity:.22;transform:scale(1);box-shadow:none}
 50%{opacity:1;transform:scale(1.3);box-shadow:0 0 4px 1px rgba(255,236,200,.9)}}
@media (prefers-reduced-motion:reduce){.stars i{animation:none;opacity:.35}}
.pick{position:relative;z-index:2;width:100%;max-width:330px;animation:up .5s cubic-bezier(.2,.8,.3,1)}
@keyframes up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.pick img{width:132px;height:132px;object-fit:contain;border-radius:50%;background:#fff;padding:11px;
 margin-bottom:20px;box-shadow:0 16px 44px rgba(0,0,0,.5),0 0 0 4px rgba(212,160,84,.55)}
.pick h1{font-size:1.9rem;font-weight:700;letter-spacing:.5px}
.pick .sub{color:#d4a054;font-size:.82rem;letter-spacing:2.5px;margin:14px 0 26px;
 display:flex;align-items:center;justify-content:center;gap:11px}
.pick .sub::before,.pick .sub::after{content:"";height:1px;width:38px;
 background:linear-gradient(90deg,transparent,#d4a054)}
.pick .sub::after{background:linear-gradient(270deg,transparent,#d4a054)}
.opts{display:flex;flex-direction:column;gap:12px}
.opts a{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;color:#fff;
 font-weight:700;font-size:1.05rem;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.20);
 border-radius:16px;padding:15px 20px;transition:.22s cubic-bezier(.2,.8,.3,1);backdrop-filter:blur(6px)}
.opts a:hover{background:linear-gradient(135deg,#d4a054,#c08a3e);color:#2a1810;border-color:transparent;
 transform:translateY(-3px);box-shadow:0 12px 26px rgba(212,160,84,.4)}
.opts a small{font-weight:400;opacity:.65;font-size:.78rem}
