@import url('/assets/fonts/fonts.css');

:root {
  --black: #030303;
  --black-soft: #090909;
  --ink: #f4eded;
  --muted: #a99b9b;
  --subtle: #6d6060;
  --red: #e31717;
  --red-bright: #ff3030;
  --red-dark: #70080a;
  --red-faint: rgba(221, 20, 25, 0.12);
  --line: rgba(238, 78, 78, 0.24);
  --mono:"Audiowide","Changa", sans-serif;
  --display:"Audiowide","Changa", "Arial Black", sans-serif;
  --arabic:"Changa", Tahoma, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; min-width: 320px; background: var(--black); color: var(--ink); font-family: var(--display); }
button, input { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, a:focus-visible { outline: 2px solid var(--red-bright); outline-offset: 4px; }

.redlock-page { position: relative; min-height: 100svh; overflow: hidden; background: #030303; }
.redlock-page::before { content: ""; position: fixed; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 47%, rgba(115, 6, 8, 0.14), transparent 42%), linear-gradient(180deg, #020202 0%, #050303 48%, #020202 100%); }
.redlock-page::after { content: ""; position: fixed; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(0,0,0,.46), transparent 22%, transparent 78%, rgba(0,0,0,.46)), linear-gradient(180deg, rgba(0,0,0,.62), transparent 24%, transparent 76%, rgba(0,0,0,.68)); }

.binary-rain { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; opacity: .72; mask-image: linear-gradient(to bottom, transparent 0%, black 11%, black 88%, transparent 100%); }
.binary-stream { position: absolute; top: -150vh; width: 13px; color: rgba(214, 27, 29, .34); font: 13px/1.48 var(--mono); letter-spacing: 0; text-align: center; text-shadow: 0 0 9px rgba(233, 17, 20, .14); white-space: pre-wrap; user-select: none; animation: binary-fall var(--fall-duration) linear var(--fall-delay) infinite; }
.noise-layer { position: fixed; inset: 0; z-index: 2; pointer-events: none; opacity: .13; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }

.site-header { position: fixed; top: 0; right: 0; left: 0; z-index: 10; display: flex; align-items: flex-start; justify-content: space-between; padding: 24px clamp(22px, 4vw, 58px); direction: ltr; }
.header-alansari { width: 138px; height: 52px; display: grid; place-items: center; direction: rtl; }.header-alansari img { display: block; width: 138px; height: 52px; object-fit: contain; filter: grayscale(1) brightness(2.3) contrast(.72) drop-shadow(0 0 8px rgba(255,255,255,.28)) drop-shadow(0 0 22px rgba(227,23,23,.95)); }
.menu-toggle { width: 49px; height: 43px; display: grid; align-content: center; justify-items: start; gap: 6px; padding: 0 10px; color: var(--red); border: 1px solid rgba(224, 27, 29, .45); background: rgba(8, 4, 4, .48); transition: background .18s ease, border-color .18s ease; }.menu-toggle:hover { background: rgba(163, 12, 14, .18); border-color: var(--red-bright); }.menu-toggle span { display: block; height: 1px; background: currentColor; }.menu-toggle span:nth-child(1) { width: 26px; }.menu-toggle span:nth-child(2) { width: 18px; }.menu-toggle span:nth-child(3) { width: 23px; }

.contact-panel { position: fixed; top: 0; bottom: 0; left: 0; z-index: 30; width: min(100% - 34px, 410px); padding: 26px; color: var(--ink); background: linear-gradient(145deg, #120405, #050303 70%); border-right: 1px solid rgba(232, 29, 31, .4); box-shadow: 20px 0 70px rgba(0,0,0,.55); transform: translateX(-104%); transition: transform .34s cubic-bezier(.2,.8,.2,1); }.contact-panel.is-open { transform: translateX(0); }.contact-panel__top { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font:11px/1 var(--mono); letter-spacing:.11em; }.contact-panel__top p { margin:0; }.contact-panel__top button { width:34px; height:34px; color:var(--red-bright); border:1px solid rgba(255,55,55,.3); background:transparent; font:24px/1 var(--mono); }.contact-panel__content { margin-top: min(18vh, 150px); }.contact-pulse { display:block; width:8px; height:8px; margin-bottom:20px; border-radius:50%; background:var(--red); box-shadow:0 0 0 7px rgba(227,23,23,.11),0 0 24px rgba(227,23,23,.7); }.contact-panel h2 { margin:0; font-size:34px; letter-spacing:-.8px; }.contact-panel p { max-width:290px; margin:15px 0 27px; color:var(--muted); font:14px/2 var(--arabic); }.telegram-link { position:relative; display:grid; grid-template-columns:1fr auto; gap:4px; padding:16px; color:#ffe9e9; border:1px solid rgba(237,56,56,.6); background:linear-gradient(90deg,rgba(174,10,12,.22),transparent); text-decoration:none; overflow:hidden; transition:background .2s ease, transform .2s ease; }.telegram-link:hover { transform:translateX(3px); background:rgba(181,15,17,.27); }.telegram-link span { grid-column:1/-1; color:#ff8888; font:10px/1 var(--mono); letter-spacing:.15em; }.telegram-link b { direction:ltr; font:600 13px/1.4 var(--mono); }.telegram-link i { font:22px/1 var(--mono); color:var(--red-bright); }.menu-scrim { position:fixed; inset:0; z-index:25; visibility:hidden; opacity:0; background:rgba(0,0,0,.6); transition:opacity .25s ease, visibility .25s; }.menu-scrim.is-visible { visibility:visible; opacity:1; }

.access-main { position: relative; z-index: 3; min-height: 100svh; display: grid; place-items: center; padding: 110px 22px 76px; }.access-core { width: min(100%, 510px); text-align: center; }.access-code { margin:0; color:#9c4c4e; font:10px/1.4 var(--mono); letter-spacing:.16em; }.hero-biohazard { width: clamp(112px, 13vw, 164px); height: clamp(112px, 13vw, 164px); display:grid; place-items:center; margin:13px auto 7px; }.hero-biohazard img { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 0 14px rgba(231,23,23,.22)); }.signal-rule { display:flex; align-items:center; justify-content:center; gap:7px; margin:8px auto 16px; }.signal-rule span { display:block; width:56px; height:1px; background:linear-gradient(90deg,transparent,var(--red)); }.signal-rule span:last-child { transform:scaleX(-1); }.signal-rule i { display:block; width:5px; height:5px; border-radius:50%; background:var(--red); box-shadow:0 0 16px rgba(235,17,19,.76); }
.access-core h1 { margin:0; color:var(--red-bright); font:800 clamp(35px, 5.7vw, 64px)/1 var(--display); letter-spacing:clamp(1px,.55vw,6px); text-shadow:0 0 16px rgba(235,20,22,.18); }.font-tag { margin:12px 0 0; color:#a74647; font:10px/1.2 var(--mono); letter-spacing:.2em; }.attempts-notice { margin:22px 0 25px; color:#bba2a2; font:13px/1.9 var(--arabic); }.attempts-notice strong { color:var(--red-bright); font-weight:800; }
.unlock-form { display:grid; gap:9px; text-align:right; }.unlock-form label { color:#dfb1b1; direction:ltr; font:11px/1.2 var(--mono); letter-spacing:.13em; }.password-control { position:relative; }.password-control input { width:100%; height:61px; padding:0 58px 0 17px; color:#fff4f4; border:1px solid rgba(236,38,41,.56); border-radius:0; outline:0; background:rgba(8,3,3,.85); box-shadow:inset 0 0 0 1px rgba(255,77,77,.04),0 0 22px rgba(121,7,9,.1); transition:border-color .2s ease,box-shadow .2s ease; }.password-control input::placeholder { color:#796667; }.password-control input:focus { border-color:var(--red-bright); box-shadow:0 0 0 4px rgba(227,23,23,.09),0 0 28px rgba(126,5,6,.18); }.password-control input[aria-invalid="true"] { border-color:#ff5656; }.visibility-toggle { position:absolute; top:50%; right:8px; width:43px; height:43px; transform:translateY(-50%); color:#c83e3e; border:0; background:transparent; font:21px/1 var(--mono); }.visibility-toggle:hover { color:var(--red-bright); }.open-eye { display:none; }.visibility-toggle.is-open .closed-eye { display:none; }.visibility-toggle.is-open .open-eye { display:inline; }.form-state { min-height:18px; margin:0; color:#c9a8a8; font:11px/1.5 var(--arabic); text-align:right; }.form-state.is-error { color:#ff7777; }.form-state.is-locked { color:#ff9f9f; }.unlock-button { width:100%; height:56px; display:flex; align-items:center; justify-content:center; gap:12px; color:white; border:1px solid #ff4141; border-radius:0; background:linear-gradient(90deg,#950d10,#e31b1e 60%,#a20a0c); font:700 13px/1 var(--display); letter-spacing:.12em; box-shadow:0 9px 30px rgba(156,5,7,.25); transition:transform .18s ease, filter .18s ease; }.unlock-button:hover { transform:translateY(-2px); filter:brightness(1.12); }.unlock-button i { font:21px/1 var(--mono); }.unlock-button:disabled { opacity:.43; cursor:not-allowed; transform:none; }.reset-demo { padding:5px; color:#bc7777; border:0; background:transparent; font:11px/1.7 var(--arabic); }.reset-demo:hover { color:var(--red-bright); }.security-description { max-width:460px; margin:28px auto 13px; color:#ad9999; font:12px/2 var(--arabic); }.security-meta { display:flex; justify-content:center; align-items:center; gap:9px; color:#814748; font:9px/1.3 var(--mono); letter-spacing:.06em; direction:ltr; }.security-meta b { width:3px; height:3px; border-radius:50%; background:var(--red); }
.site-footer { position:fixed; right:0; bottom:0; left:0; z-index:4; display:flex; justify-content:space-between; padding:20px clamp(22px,4vw,58px); color:#734143; font:9px/1 var(--mono); letter-spacing:.08em; direction:ltr; }

@keyframes binary-fall { from { transform:translateY(-4vh); } to { transform:translateY(255vh); } }
@media (max-width: 560px) { .site-header { padding:17px 18px; }.header-alansari,.header-alansari img { width:104px; height:42px; }.menu-toggle { width:45px; height:39px; }.access-main { padding:100px 19px 66px; }.hero-biohazard { width:108px; height:108px; margin-top:8px; }.access-core h1 { font-size:clamp(36px,10vw,52px); letter-spacing:2px; }.attempts-notice { margin:17px 0 21px; }.security-meta { flex-wrap:wrap; }.site-footer { padding:15px 18px; }.site-footer span:last-child { display:none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }