/* TEKKEN — SETEC ARENA 2026 */
html,body { margin:0; padding:0; background:#08090b; }

/* PAGE AND BACKGROUND */
.arena-page.tekken-page { position:relative; width:100%; height:100vh; height:100dvh; min-height:550px; margin:0; padding:0; overflow:hidden; box-sizing:border-box; background:#08090b; font-family:'Segoe UI',Arial,sans-serif; }
.tekken-hero { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none; }
.tekken-atmosphere { position:absolute; inset:0; z-index:1; pointer-events:none; background:radial-gradient(ellipse at 15% 50%,rgba(255,20,55,.13),transparent 45%),radial-gradient(ellipse at 85% 50%,rgba(110,35,255,.15),transparent 45%),linear-gradient(0deg,rgba(0,0,0,.3),transparent 45%); animation:tekkenLighting 5s ease-in-out infinite alternate; }

/* SHARED HEADER */
.tekken-page .arena-header { position:absolute; z-index:10; top:0; left:0; right:0; width:100%; box-sizing:border-box; }
.tekken-back-btn { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 18px; box-sizing:border-box; border:1px solid #ff3151; border-radius:4px; background:rgba(0,0,0,.35); color:#ff3151; font-size:12px; font-weight:800; text-decoration:none; transition:background .2s,color .2s; }
.tekken-back-btn:hover { background:#ff3151; color:#fff; }

/* RAZER BRANDING */
.tekken-branding { position:absolute; z-index:3; left:4%; bottom:5.5%; width:390px; max-width:29%; pointer-events:none; animation:tekkenBrandReveal 1s ease-out 2.5s both; }
.tekken-branding img { display:block; width:100%; height:auto; object-fit:contain; filter:drop-shadow(0 6px 18px rgba(0,0,0,.45)); }

/* REGISTRATION PANEL */
.tekken-panel { position:absolute; z-index:3; top:55%; right:5%; transform:translateY(-50%); width:500px; max-width:40%; padding:35px; box-sizing:border-box; color:#fff; background:rgba(8,9,14,.94); border:1px solid rgba(255,45,75,.65); border-top:3px solid #ff1744; border-bottom:3px solid #ff1744; box-shadow:0 15px 60px rgba(0,0,0,.65); animation:tekkenPanelReveal 1s cubic-bezier(.22,1,.36,1) 3.5s both,tekkenPanelGlow 5s ease-in-out 4.5s infinite alternate; }
.tekken-heading { margin-bottom:30px; }
.tekken-heading > span { display:block; margin-bottom:18px; color:#ff3556; font-size:12px; font-weight:900; letter-spacing:3px; }
.tekken-heading h2 { margin:0 0 17px; color:#f5f0ef; font-size:18px; font-weight:800; line-height:1.5; }
.tekken-heading p { margin:0; color:#b8b6be; font-size:13px; line-height:1.8; }
.tekken-section-title { display:flex; align-items:center; gap:13px; margin-bottom:20px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.12); font-size:12px; font-weight:900; letter-spacing:1.2px; }
.tekken-section-title span { color:#ff1744; font-size:24px; font-weight:900; }
.tekken-field { min-width:0; margin-bottom:17px; }
.tekken-field label { display:block; margin-bottom:8px; color:#d0c8cb; font-size:10px; font-weight:900; letter-spacing:1.3px; }
.tekken-field input { display:block; width:100%; height:42px; padding:0 13px; box-sizing:border-box; border:1px solid #36343f; border-radius:2px; outline:none; background:rgba(4,5,10,.88); color:#fff; font-family:'Segoe UI',Arial,sans-serif; font-size:12px; transition:border-color .2s,box-shadow .2s; }
.tekken-field input::placeholder { color:#817e89; }
.tekken-field input:focus { border-color:#ff3155; box-shadow:0 0 0 2px rgba(255,49,85,.12); }
.tekken-form-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:13px; }
.tekken-form-bottom { margin-top:10px; }
.tekken-submit-btn { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; height:45px; border:1px solid #ff3155; border-radius:3px; background:linear-gradient(135deg,#f01437,#b9002d); color:#fff; font-family:inherit; font-size:13px; font-weight:900; letter-spacing:1.5px; }
.tekken-submit-btn:disabled { opacity:.65; cursor:not-allowed; }

/* LIGHTNING AND EMBERS */
.tekken-effects { position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none; }
.tekken-svg-lightning { position:absolute; z-index:2; top:18%; width:21%; height:58%; overflow:visible; pointer-events:none; opacity:0; mix-blend-mode:screen; animation:tekkenLightningFlash 6s infinite; }
.tekken-svg-red { left:7%; color:#ff3155; }
.tekken-svg-purple { right:10%; color:#a66bff; animation-delay:-3s; }
.tekken-bolt { fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 13px currentColor); }
.tekken-bolt-main { stroke-width:2.5; }
.tekken-bolt-branch { stroke-width:1.3; opacity:.7; }
.tekken-embers { position:absolute; inset:0; overflow:hidden; }
.tekken-embers::before,.tekken-embers::after { content:""; position:absolute; inset:0; background-repeat:no-repeat; background-image:radial-gradient(circle,#ff5635 0 2px,transparent 3px),radial-gradient(circle,#ff9d50 0 1px,transparent 2px),radial-gradient(circle,#ff3b45 0 2px,transparent 3px),radial-gradient(circle,#ffb46c 0 1px,transparent 2px),radial-gradient(circle,#ff523d 0 2px,transparent 3px),radial-gradient(circle,#9c69ff 0 1px,transparent 2px),radial-gradient(circle,#ff7c46 0 1px,transparent 2px),radial-gradient(circle,#b47aff 0 2px,transparent 3px); background-position:8% 92%,22% 76%,38% 86%,49% 95%,65% 88%,78% 75%,91% 90%,96% 60%; background-size:7px 7px,5px 5px,6px 6px,4px 4px,7px 7px,5px 5px,4px 4px,6px 6px; animation:tekkenEmberRise 9s linear infinite; }
.tekken-embers::after { animation-delay:-4.5s; animation-duration:12s; opacity:.55; }

/* ANIMATIONS */
@keyframes tekkenLighting { from { opacity:.55; } to { opacity:1; } }
@keyframes tekkenLightningFlash { 0%,39%,43%,47%,100% { opacity:0; } 40%,42%,46% { opacity:.85; } 41%,44% { opacity:.15; } }
@keyframes tekkenEmberRise { 0% { transform:translateY(8%); opacity:0; } 15% { opacity:.8; } 85% { opacity:.6; } 100% { transform:translateY(-45%); opacity:0; } }
@keyframes tekkenBrandReveal { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes tekkenPanelReveal { from { opacity:0; transform:translate(55px,-50%); } to { opacity:1; transform:translate(0,-50%); } }
@keyframes tekkenPanelGlow { from { box-shadow:0 15px 55px rgba(0,0,0,.65); } to { box-shadow:0 15px 60px rgba(0,0,0,.65),0 0 30px rgba(255,20,65,.12); } }

/* TABLET */
@media(max-width:1100px) {
    .tekken-panel { right:3%; max-width:46%; padding:25px; }
    .tekken-branding { left:4%; bottom:5%; width:320px; max-width:28%; }
}

/* MOBILE — TWO-ROW HEADER, FULL PAGE FORM, BRANDING AT BOTTOM */
@media(max-width:700px) {
    .arena-page.tekken-page { display:flex; flex-direction:column; align-items:stretch; height:auto; min-height:100dvh; overflow:visible; padding:0 14px 30px; }
    .tekken-hero { position:fixed; inset:0; width:100%; height:100dvh; object-position:center; }
    .tekken-atmosphere { position:fixed; inset:0; background:rgba(0,0,0,.42); }
    .tekken-effects { position:fixed; inset:0; }

    /* Header: existing links reflow onto second row */
    .tekken-page .arena-header { position:relative; flex-shrink:0; width:calc(100% + 28px); margin:0 -14px; height:auto; min-height:0; background:rgba(5,6,9,.96); }
    .tekken-page .arena-header-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:0; width:calc(100% - 24px); height:auto; min-height:60px; padding:8px 0 0; box-sizing:border-box; }
    .tekken-page .arena-nav { display:flex; order:3; justify-content:center; align-items:center; gap:18px; width:100%; height:44px; margin-top:8px; border-top:1px solid rgba(255,255,255,.08); }
    .tekken-page .arena-nav a { display:inline-flex; align-items:center; justify-content:center; height:100%; font-size:10px; white-space:nowrap; }
    .tekken-page .arena-nav a.active { color:#ff8500; }
    .tekken-back-btn { min-height:34px; padding:0 10px; font-size:10px; }

    /* Form: normal page scroll rather than clipped internal scroll */
    .tekken-panel { position:relative; order:2; flex-shrink:0; top:auto; right:auto; left:auto; transform:none; width:100%; max-width:none; max-height:none; overflow:visible; margin:20px auto 0; padding:22px 17px; background:rgba(8,9,14,.91); border:1px solid rgba(255,45,75,.65); border-top:3px solid #ff1744; border-bottom:3px solid #ff1744; animation:tekkenMobilePanelReveal .8s ease-out .8s both,tekkenPanelGlow 5s ease-in-out 1.6s infinite alternate; }
    .tekken-heading { margin-bottom:20px; }
    .tekken-heading > span { margin-bottom:12px; }
    .tekken-heading h2 { font-size:16px; }
    .tekken-form-row { grid-template-columns:1fr; gap:0; }
    .tekken-field { margin-bottom:12px; }
    .tekken-field input { height:42px; font-size:13px; }

    /* Logo after registration and submit */
    .tekken-branding { position:relative; order:3; flex-shrink:0; top:auto; bottom:auto; right:auto; left:auto; width:260px; max-width:85%; margin:22px auto 8px; animation:tekkenBrandReveal .8s ease-out 1.3s both; }
    .tekken-svg-lightning { width:28%; height:45%; top:25%; }
    .tekken-svg-red { left:0; }
    .tekken-svg-purple { right:0; }
}
@keyframes tekkenMobilePanelReveal { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

/* ACCESSIBILITY */
@media(prefers-reduced-motion:reduce) {
    .tekken-atmosphere,.tekken-branding,.tekken-panel,.tekken-svg-lightning,.tekken-embers::before,.tekken-embers::after { animation:none; }
}
/* TEKKEN REGISTRATION INFORMATION */
.arena-registration-note {
    margin-top:18px;
    padding:15px 8px 0;
    border-top:1px solid rgba(255,255,255,.10);
    text-align:center;
}

.arena-registration-note p {
    margin:0 0 10px;
    color:#d6d0d3;
    font-size:11px;
    line-height:1.6;
}

.arena-registration-note .arena-note-age {
    margin-bottom:0;
    color:#ff4967;
    font-size:11px;
    font-weight:700;
}
.arena-page.tekken-page{font-family:'TT Norms Pro',Arial,sans-serif}
.tekken-field input{font-family:inherit}

.tekken-submit-btn{
    cursor:pointer;
    font-family:inherit;
}

.tekken-submit-btn:hover{
    filter:brightness(1.12);
}