:root {
  --public-bg: #020706;
  --public-text: #f5f7f7;
  --public-muted: #9aa8a5;
  --public-line: rgba(148, 177, 170, 0.23);
  --public-emerald: #17d49d;
  --public-gold: #d4a33a;
  --public-font: "Manrope", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
}

.public-access-gate { position: fixed; inset: 0; z-index: 10000; min-height: 100dvh; overflow: auto; color: var(--public-text); background: var(--public-bg); font-family: var(--public-font); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.public-access-gate, .public-access-gate * { box-sizing: border-box; }
.public-access-gate[hidden] { display: none; }
.app-shell[hidden] { display: none !important; }

.public-access-hero { position: relative; min-height: 100svh; overflow: hidden; isolation: isolate; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); background: radial-gradient(60% 76% at 81% 48%, rgba(0,96,71,.08), transparent 72%), linear-gradient(105deg, #020706 0%, #020807 48%, #03100d 100%); }
.public-access-hero__background { --px: 0px; --py: 0px; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: url("../assets/landing/hero-bg.webp"); background-size: cover; background-repeat: no-repeat; background-position: center; transform: translate3d(var(--px), var(--py), 0) scale(1.006); transform-origin: center; filter: saturate(1.02) contrast(1.015) brightness(.995); will-change: transform; animation: public-background-in 1.1s cubic-bezier(.2,.7,.2,1) both; }
.public-access-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(1,5,5,.24) 0%, rgba(1,5,5,.14) 26%, rgba(1,5,5,.06) 45%, transparent 63%), linear-gradient(0deg, rgba(1,5,5,.24), transparent 25%); }
.public-access-ambient { position: absolute; z-index: 1; border-radius: 999px; filter: blur(90px); opacity: .16; pointer-events: none; }
.public-access-ambient--green { width: 390px; height: 390px; right: 18%; bottom: -24%; background: #008a63; }
.public-access-ambient--gold { width: 250px; height: 250px; right: 4%; top: -14%; background: #7a5512; opacity: .12; }

.public-access-brand { position: absolute; z-index: 5; top: clamp(26px, 5.4vh, 58px); left: clamp(28px, 5vw, 82px); display: inline-flex; align-items: center; gap: 12px; user-select: none; }
.public-access-brand__mark { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; transform: scale(1.04); filter: drop-shadow(0 0 12px rgba(205,156,44,.16)); }
.public-access-brand__name { font-size: 25px; line-height: 1; font-weight: 680; letter-spacing: -.02em; }
.public-access-language { position: absolute; z-index: 6; top: clamp(28px, 5.4vh, 58px); right: clamp(28px, 4.6vw, 78px); min-width: 52px; min-height: 44px; padding: 0 14px; border: 1px solid rgba(31,218,164,.38); border-radius: 9px; background: rgba(3,10,9,.28); color: #dffaf1; font: 700 12px/1 var(--public-font); letter-spacing: .07em; cursor: pointer; backdrop-filter: blur(10px); transition: transform .18s ease, background .18s ease; }
.public-access-language:hover { transform: translateY(-1px); background: rgba(7,23,19,.52); }

.public-access-hero__content { position: relative; z-index: 4; width: min(760px, 48vw); margin-left: clamp(72px, 9.5vw, 184px); padding-top: clamp(174px, 25vh, 264px); padding-bottom: 72px; animation: public-content-in .8s cubic-bezier(.2,.7,.2,1) both; }
.public-access-hero__title { margin: 0; max-width: 760px; font-size: clamp(54px, 5.55vw, 84px); line-height: .995; letter-spacing: -.004em; font-weight: 560; }
.public-access-hero__title > span { display: block; white-space: nowrap; }
.public-access-hero__title-accent { margin-top: .075em; color: #16c493; }
.public-access-gate[data-language="ru"] .public-access-hero__title { font-size: clamp(48px, 4.85vw, 74px); }
.public-access-hero__description { max-width: 590px; margin: 30px 0 0; color: var(--public-muted); font-size: clamp(17px, 1.3vw, 21px); line-height: 1.54; font-weight: 410; letter-spacing: -.008em; }

.public-access-actions { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 39px; }
.public-access-action { position: relative; display: inline-flex; min-height: 60px; align-items: center; justify-content: center; gap: 12px; padding: 0 24px; border: 1px solid var(--public-line); border-radius: 10px; background: rgba(6,14,13,.5); color: #eef3f1; font-size: 15.5px; font-weight: 640; letter-spacing: -.008em; text-decoration: none; backdrop-filter: blur(10px); transition: transform .22s ease, background .22s ease; }
.public-access-action[aria-disabled="true"] { pointer-events: none; opacity: .55; }
.public-access-action__icon { width: 24px; height: 24px; display: inline-grid; place-items: center; }
.public-access-action__icon svg { width: 24px; height: 24px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.public-access-action--channel .public-access-action__icon svg path { fill: currentColor; stroke: none; }
.public-access-action--license { color: #f0c869; border-color: rgba(212,163,58,.52); box-shadow: inset 0 0 0 1px rgba(212,163,58,.035); }
.public-access-action--license span:last-child, .public-access-action--channel span:last-child { color: #eef3f1; }
.public-access-action--channel { color: var(--public-emerald); border-color: rgba(31,218,164,.32); }
.public-access-action:hover { transform: translateY(-2px); background: rgba(10,25,21,.78); }

.public-access-authorization { display: flex; align-items: center; gap: 13px; min-height: 44px; margin-top: 23px; color: #899792; font-size: 14px; }
.public-access-authorization__label { white-space: nowrap; }
.public-access-authorization__button { display: inline-flex; min-height: 44px; align-items: center; gap: 7px; padding: 0 20px; border: 1px solid rgba(26,202,147,.36); border-radius: 8px; color: #24cf9c; background: rgba(2,11,9,.58); font-size: 15px; font-weight: 640; text-decoration: none; transition: color .2s ease, background .2s ease, transform .2s ease; }
.public-access-authorization__button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.public-access-authorization__button:hover { color: #6de7c4; background: rgba(6,29,23,.72); transform: translateY(-1px); }
.public-access-authorization__button:hover svg { transform: translateX(2px); }
.public-access-content, #public-access-content { display: none; max-width: 590px; margin-top: 24px; scroll-margin: 28px; }
.public-access-gate[data-authorization-expanded="true"] #public-access-content:not(:empty) { display: block; }
#public-access-content .settings-card { margin: 0; }
#public-access-content.license-authorization-panel { padding: 22px; border: 1px solid rgba(31,218,164,.24); border-radius: 12px; background: rgba(2,11,9,.82); backdrop-filter: blur(16px); }
.public-access-language:focus-visible, .public-access-action:focus-visible, .public-access-authorization__button:focus-visible, .public-access-content button:focus-visible, .public-access-content a:focus-visible { outline: 2px solid #54e3ba; outline-offset: 3px; }

@keyframes public-content-in { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@keyframes public-background-in { from { opacity: 0; transform: translate3d(20px,5px,0) scale(1.012); } to { opacity: 1; transform: translate3d(0,0,0) scale(1.006); } }

@media (max-width: 1250px) {
  .public-access-hero__content { width: min(700px, 52vw); margin-left: clamp(52px, 7vw, 96px); }
  .public-access-hero__background { background-position: 58% center; }
  .public-access-hero::after { background: linear-gradient(90deg, rgba(1,5,5,.4) 0%, rgba(1,5,5,.26) 40%, rgba(1,5,5,.07) 65%, transparent 84%), linear-gradient(0deg, rgba(1,5,5,.34), transparent 28%); }
}

@media (max-width: 720px) {
  .public-access-hero { min-height: 100svh; display: flex; flex-direction: column; }
  .public-access-brand { position: relative; top: auto; left: auto; margin: 25px 24px 0; }
  .public-access-brand__mark { width: 38px; height: 38px; }
  .public-access-brand__name { font-size: 22px; }
  .public-access-language { top: 25px; right: 20px; min-width: 46px; min-height: 44px; padding: 0 11px; font-size: 11px; }
  .public-access-hero__content { width: auto; margin: 0; padding: 72px 24px 48px; z-index: 5; }
  .public-access-hero__title { max-width: 590px; font-size: clamp(32px, 9.5vw, 48px); line-height: 1.01; letter-spacing: 0; font-weight: 550; }
  .public-access-gate[data-language="ru"] .public-access-hero__title { font-size: clamp(28px, 8.2vw, 44px); }
  .public-access-hero__description { max-width: 520px; margin-top: 23px; font-size: 16px; line-height: 1.55; }
  .public-access-actions { margin-top: 31px; gap: 10px; }
  .public-access-action { min-height: 53px; padding: 0 18px; font-size: 14px; border-radius: 9px; }
  .public-access-action__icon, .public-access-action__icon svg { width: 20px; height: 20px; }
  .public-access-authorization { margin-top: 18px; gap: 10px; flex-wrap: wrap; font-size: 13px; }
  .public-access-authorization__button { min-height: 44px; padding-inline: 17px; font-size: 14px; }
  .public-access-hero__background { background-size: auto 100%; background-position: 70% center; opacity: .5; transform: none; }
  .public-access-hero::after { background: linear-gradient(90deg, rgba(1,5,5,.89) 0%, rgba(1,5,5,.8) 60%, rgba(1,5,5,.58) 100%), linear-gradient(0deg, rgba(1,5,5,.67), transparent 45%); }
}

@media (max-width: 430px) {
  .public-access-brand { max-width: 180px; }
  .public-access-actions { display: grid; grid-template-columns: 1fr; max-width: 320px; }
  .public-access-action { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  .public-access-gate *, .public-access-gate *::before, .public-access-gate *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
