:root{--fox:#e8590c;--fox-d:#c94a07;--ink:#1f1a17;--muted:#6f6660;--line:#e7e2dd;--paper:#faf6f2;--glow:rgba(232,89,12,.16)}
@media (prefers-color-scheme:dark){:root{--ink:#f6efe8;--muted:#a8998d;--line:#3a302a;--paper:#15110e;--glow:rgba(232,89,12,.22)}}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{font:16px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);
  background:radial-gradient(60vmax 60vmax at 50% 38%,var(--glow),transparent 70%),var(--paper);
  min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 16px}
.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 0 24px}
.fox{width:min(38vh,240px);height:auto;filter:drop-shadow(0 18px 30px rgba(201,74,7,.25));animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
h1{margin:28px 0 6px;font-size:clamp(44px,9vw,84px);line-height:1;letter-spacing:-.035em;font-weight:800}
h1 span{color:var(--fox)}
.tagline{margin:10px 0 0;font-size:clamp(16px,2.4vw,20px);color:var(--muted);max-width:520px}
.soon{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fox-d)}
.soon::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--fox);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25}}
.enter{padding:8px 0 48px;width:100%;display:flex;justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 34px;border-radius:12px;background:var(--fox-d);color:#fff;
  font-weight:700;font-size:17px;text-decoration:none;box-shadow:0 10px 24px rgba(201,74,7,.3);transition:background .15s,transform .15s}
.btn:hover{background:#a33c08;transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid var(--fox);outline-offset:3px}
.btn::after{content:"→";font-weight:400}
footer{padding:0 0 20px;font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px}
footer a{color:var(--muted)}footer a:hover{color:var(--ink)}
/* Лиса рычит: раз в 9 секунд плавно прижимает уши, чуть опускает голову, щурится, морщит переносицу и приоткрывает пасть — клыки */
.fox .head,.fox .ear,.fox .eye,.fox .mouth,.fox .jaw,.fox .snarl-lines,.fox .nose{transform-box:view-box;animation-duration:9s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.45,0,.25,1)}
.fox .head{transform-origin:120px 130px;animation-name:lean}
.fox .ear-l{transform-origin:70px 104px;animation-name:ear-l}
.fox .ear-r{transform-origin:170px 104px;animation-name:ear-r}
.fox .eye-l{transform-origin:88px 127px;animation-name:squint}
.fox .eye-r{transform-origin:152px 127px;animation-name:squint}
.fox .mouth{transform-origin:120px 194px;animation-name:mouth}
.fox .jaw{animation-name:jaw}
.fox .nose{transform-origin:120px 186px;animation-name:nose}
.fox .snarl-lines{opacity:0;animation-name:lines}
@keyframes lean{0%,50%,92%,100%{transform:none}62%,80%{transform:translateY(3px) scale(1.015)}}
@keyframes ear-l{0%,48%,94%,100%{transform:none}60%,82%{transform:rotate(-11deg)}}
@keyframes ear-r{0%,48%,94%,100%{transform:none}60%,82%{transform:rotate(11deg)}}
@keyframes squint{0%,52%,90%,100%{transform:none}62%,80%{transform:scaleY(.8)}}
@keyframes lines{0%,52%,90%,100%{opacity:0}63%,80%{opacity:1}}
@keyframes nose{0%,52%,90%,100%{transform:none}63%,80%{transform:translateY(-2px)}}
@keyframes mouth{0%,54%,90%,100%{transform:scaleY(0)}64%{transform:scaleY(1)}69%{transform:scaleY(.9)}74%{transform:scaleY(1)}80%{transform:scaleY(.94)}}
@keyframes jaw{0%,54%,90%,100%{transform:translateY(-21px)}64%{transform:translateY(0)}69%{transform:translateY(-2px)}74%{transform:translateY(0)}80%{transform:translateY(-1px)}}
@media (prefers-reduced-motion:reduce){.fox,.soon::before,.fox *{animation:none!important}.fox .mouth{transform:scaleY(0)}.fox .jaw{transform:translateY(-21px)}}
.soon a{color:inherit}
.slogan{margin:14px 0 0;font-size:clamp(22px,3.4vw,32px);line-height:1.2;font-weight:700;letter-spacing:-.02em}
.slogan-en{margin:8px 0 0;font-size:clamp(12px,1.4vw,15px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.actions{margin-top:32px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;width:100%}
.btn-alt{background:var(--paper);color:var(--ink);border:1.5px solid var(--line);box-shadow:none}
.btn-alt:hover{background:var(--paper);border-color:var(--fox);color:var(--ink)}
.btn-alt::after{content:none}
.login{margin-top:22px;font-size:15px;font-weight:300;color:var(--muted);text-decoration:none;padding:10px 16px}
.login:hover{color:var(--ink);text-decoration:underline}
.login:focus-visible{outline:2px solid var(--fox);outline-offset:2px;border-radius:6px}
@media (max-width:480px){.actions .btn{flex:1 1 100%}}