/* ============ ШРИФТЫ ============ */
@font-face{font-family:'JetBrains Mono';font-weight:400;font-display:swap;src:url('../assets/fonts/jetbrainsmono-400-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'JetBrains Mono';font-weight:400;font-display:swap;src:url('../assets/fonts/jetbrainsmono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-weight:400;font-display:swap;src:url('../assets/fonts/jetbrainsmono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JetBrains Mono';font-weight:700;font-display:swap;src:url('../assets/fonts/jetbrainsmono-700-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'JetBrains Mono';font-weight:700;font-display:swap;src:url('../assets/fonts/jetbrainsmono-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-weight:700;font-display:swap;src:url('../assets/fonts/jetbrainsmono-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Unbounded';font-weight:700;font-display:swap;src:url('../assets/fonts/unbounded-700-cyrillic.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-weight:700;font-display:swap;src:url('../assets/fonts/unbounded-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Unbounded';font-weight:700;font-display:swap;src:url('../assets/fonts/unbounded-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ============ ТОКЕНЫ ============ */
:root{
  --bg:#08090b;
  --ink:#f6edd7;
  --dim:#8b8677;
  --faint:#5d594f;
  --red:#e8362a;
  --red-hot:#ff5140;
  --panel:#e7ddc4;
  --panel-2:#d8cdb0;
  --panel-ink:#111216;
  --line:rgba(246,237,215,.15);
  --line-hard:rgba(246,237,215,.32);
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --display:'Unbounded',system-ui,sans-serif;
  --hud:clamp(.62rem,.72vw,.74rem);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--mono);font-size:15px;line-height:1.55;
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.1}
p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.mono{font-family:var(--mono)}
.dim{color:var(--dim)}

/* ============ СЛОИ ФОНА ============ */
#webgl{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0}

.grain{
  position:fixed;inset:-50%;z-index:2;pointer-events:none;opacity:.16;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
  animation:grainShift .6s steps(3) infinite;
}
@keyframes grainShift{
  0%{transform:translate(0,0)}33%{transform:translate(-2%,1%)}66%{transform:translate(1%,-2%)}100%{transform:translate(0,0)}
}
.scanlines{
  position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.42) 2px 3px);
  mix-blend-mode:multiply;
}
.vignette{
  position:fixed;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 42%,rgba(0,0,0,.78) 100%);
}
@media (prefers-reduced-motion:reduce){ .grain{animation:none} }

/* ============ ВЕРХНИЙ HUD ============ */
.hud-top{
  position:fixed;top:0;left:0;right:0;z-index:20;
  display:flex;align-items:flex-start;gap:1.2rem;
  padding:1.1rem clamp(1rem,2.4vw,2rem) 0;
  font-size:var(--hud);letter-spacing:.08em;
}
.brand{display:flex;align-items:center;gap:.55rem;flex:none}
.brand__mark{
  font-family:var(--display);font-size:1.32rem;letter-spacing:-.03em;
  color:transparent;-webkit-text-stroke:1px var(--ink);
  text-shadow:0 0 22px rgba(246,237,215,.32);
}
.brand__word{color:var(--dim);letter-spacing:.22em;padding-top:.25rem}
@media (max-width:900px){.brand__word{display:none}}

.menu{display:flex;gap:clamp(.6rem,1.8vw,1.9rem);margin-left:auto;margin-right:auto}
.menu__item{
  position:relative;display:block;padding:.1rem 0 .5rem;color:var(--ink);
  transition:color .25s var(--ease);white-space:nowrap;
}
.menu__item i{
  display:block;height:6px;margin-top:.35rem;opacity:.55;
  background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 4px);
  transition:opacity .25s var(--ease),background .25s var(--ease);
}
.menu__item:hover{color:var(--red-hot)}
.menu__item:hover i{opacity:1;background:repeating-linear-gradient(90deg,var(--red-hot) 0 2px,transparent 2px 4px)}
.menu__item.is-current{color:var(--red)}
.menu__item.is-current i{opacity:1;background:repeating-linear-gradient(90deg,var(--red) 0 3px,transparent 3px 4px)}
.menu__item--cta{color:var(--red-hot)}

.sound{display:flex;align-items:center;gap:.5rem;flex:none;letter-spacing:.1em;color:var(--dim)}
.sound b{color:var(--ink)}
.sound__bars{display:flex;align-items:flex-end;gap:2px;height:11px}
.sound__bars i{width:2px;height:20%;background:var(--faint);transition:background .3s}
.sound.is-on .sound__bars i{background:var(--red);animation:eq .9s ease-in-out infinite alternate}
.sound.is-on .sound__bars i:nth-child(2){animation-delay:.1s}
.sound.is-on .sound__bars i:nth-child(3){animation-delay:.22s}
.sound.is-on .sound__bars i:nth-child(4){animation-delay:.34s}
.sound.is-on .sound__bars i:nth-child(5){animation-delay:.16s}
.sound.is-on .sound__bars i:nth-child(6){animation-delay:.42s}
.sound.is-on .sound__bars i:nth-child(7){animation-delay:.28s}
.sound.is-on .sound__bars i:nth-child(8){animation-delay:.06s}
@keyframes eq{from{height:15%}to{height:100%}}

.burger{display:none;flex:none;width:34px;height:26px;position:relative}
.burger i{position:absolute;left:4px;right:4px;height:1.5px;background:var(--ink);transition:transform .3s var(--ease)}
.burger i:first-child{top:8px}.burger i:last-child{bottom:8px}
.burger[aria-expanded="true"] i:first-child{transform:translateY(4.5px) rotate(45deg)}
.burger[aria-expanded="true"] i:last-child{transform:translateY(-4.5px) rotate(-45deg)}

@media (max-width:860px){
  .hud-top{align-items:center;padding-top:.8rem}
  .burger{display:block;margin-left:auto}
  .sound{order:3;margin-left:.8rem}
  .menu{
    position:fixed;inset:0;z-index:19;margin:0;
    flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;
    background:rgba(8,9,11,.96);font-size:1rem;letter-spacing:.14em;
    opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;
  }
  .menu.is-open{opacity:1;visibility:visible}
}
/* низкий экран (телефон в альбомной): пункты меню начинали слипаться */
@media (max-width:860px) and (max-height:560px){
  .menu{gap:.75rem;font-size:.82rem}
}

/* ============ НИЖНИЙ HUD ============ */
/* контент проезжает под HUD — без подложки строки сливаются в кашу */
.hud-top::before,.hud-bottom::before{
  content:"";position:absolute;left:0;right:0;height:150%;z-index:-1;pointer-events:none;
}
.hud-top::before{top:0;background:linear-gradient(180deg,rgba(8,9,11,.92) 0%,rgba(8,9,11,.72) 45%,transparent 100%)}
.hud-bottom::before{bottom:0;background:linear-gradient(0deg,rgba(8,9,11,.94) 0%,rgba(8,9,11,.74) 45%,transparent 100%)}

.hud-bottom{
  position:fixed;left:0;right:0;bottom:0;z-index:20;
  display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;
  padding:0 clamp(1rem,2.4vw,2rem) 1.1rem;
  font-size:var(--hud);letter-spacing:.1em;color:var(--dim);pointer-events:none;
}
.hud-log{display:flex;flex-direction:column;gap:.3rem;padding-left:.9rem;border-left:1px solid var(--line-hard);min-height:3.4em}
.hud-log span{opacity:.55}
.hud-log span:last-child{opacity:1;color:var(--ink)}
.hud-meta{display:flex;flex-direction:column;gap:.3rem;align-items:flex-end;padding-right:.9rem;border-right:1px solid var(--line-hard);text-align:right}
@media (max-width:640px){
  .hud-bottom{font-size:.58rem}
  .hud-log{display:none}
  /* лог скрыт, и space-between прижимал бы метаданные к левому краю */
  .hud-meta{margin-left:auto}
}

/* ============ ЭКРАНЫ ============ */
#screens{position:fixed;inset:0;z-index:10}
.screen{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  opacity:0;pointer-events:none;
}
.screen.is-active{opacity:1;pointer-events:auto}
.screen[hidden]{display:none}

.screen__bigword{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:var(--display);font-size:clamp(4rem,17vw,15rem);letter-spacing:-.04em;
  color:rgba(246,237,215,.045);white-space:nowrap;pointer-events:none;user-select:none;z-index:-1;
}

.screen__scroll{
  position:absolute;inset:0;
  padding:clamp(4.6rem,9vh,7rem) clamp(1rem,2.4vw,2rem) clamp(4rem,8vh,6rem);
  overflow:hidden;
}
.screen__inner{
  width:min(100%,1180px);margin:0 auto;
  display:flex;flex-direction:column;gap:clamp(1.6rem,3.4vh,2.8rem);
  will-change:transform;
}

/* ---------- INTRO ---------- */
.intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1rem,6vw,6rem);pointer-events:none}
.intro__side{pointer-events:auto}
.intro__caption{
  position:absolute;left:0;right:0;bottom:clamp(5.5rem,14vh,9rem);
  text-align:center;padding:0 1rem;
}
.intro__caption h1{
  font-family:var(--display);font-size:clamp(1.15rem,2.6vw,2rem);letter-spacing:-.02em;
  text-shadow:0 2px 30px rgba(0,0,0,.9);
}
.intro__caption p{margin-top:.9rem;font-size:var(--hud);letter-spacing:.16em}
@media (max-width:700px){
  .intro{flex-direction:column;justify-content:flex-end;gap:.8rem;padding-bottom:11rem}
  .intro__side{width:100%;max-width:320px}
  .intro__side .btn{width:100%}
  .intro__caption{bottom:5rem}
}

/* ---------- КНОПКИ ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.6rem;font-weight:700;font-size:.82rem;letter-spacing:.14em;
  color:var(--panel-ink);background:var(--panel);
  border:1px solid var(--panel);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);
  transition:background .22s var(--ease),color .22s var(--ease),transform .22s var(--ease);
}
.btn:hover{background:#fff;transform:translateY(-1px)}
.btn--accent{background:var(--red);border-color:var(--red);color:#fff}
.btn--accent:hover{background:var(--red-hot)}
.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;padding-top:.4rem}

/* ---------- ОБЩИЕ БЛОКИ ---------- */
.panel-head{
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-size:var(--hud);letter-spacing:.14em;
  padding-bottom:.7rem;border-bottom:1px solid var(--line);
}
.h-display{font-family:var(--display);font-size:clamp(1.7rem,4.4vw,3.3rem);letter-spacing:-.03em}
.h-display--sm{font-size:clamp(1.4rem,3vw,2.2rem)}
.lede{max-width:62ch;color:#cfc7b2;font-size:clamp(.92rem,1.1vw,1.02rem)}
.note{color:var(--dim);font-size:.88rem;max-width:70ch;border-left:2px solid var(--red);padding-left:.9rem}

.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.tiles--4{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.tile{background:rgba(11,12,15,.90);padding:1.1rem 1.15rem 1.25rem;transition:background .25s var(--ease)}
.tile:hover{background:rgba(232,54,42,.09)}
.tile h3{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.5rem}
.tile h3::before{content:"› ";color:var(--red)}
.tile p{font-size:.85rem;color:#b7b0a0;line-height:1.5}
.tile--wide{grid-column:1/-1}
.tile--safe h3::before{content:"■ ";color:var(--red)}

.qa{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.qa__item h4{font-size:.9rem;letter-spacing:.04em;margin-bottom:.5rem;color:var(--ink)}
.qa__item p{font-size:.85rem;color:#b0a999;margin-bottom:.5rem}

.warn{border:1px solid var(--red);padding:1.2rem 1.3rem;background:rgba(232,54,42,.07);position:relative}
.warn--calm{border-color:var(--line-hard);background:rgba(246,237,215,.04)}
.warn__tag{position:absolute;top:-.62rem;left:1rem;background:var(--bg);padding:0 .5rem;font-size:var(--hud);letter-spacing:.16em;color:var(--red)}
.warn--calm .warn__tag{color:var(--dim)}
.warn h3{font-size:1rem;margin-bottom:.6rem}
.warn p{font-size:.86rem;color:#c0b9a8;margin-bottom:.45rem}

/* ---------- ДОСЬЕ ---------- */
.dossier{border:1px solid var(--line-hard);background:rgba(12,13,16,.55)}
.dossier__bar{display:flex;align-items:center;gap:.6rem;background:var(--panel-2);color:var(--panel-ink);padding:.5rem .8rem;font-size:var(--hud);letter-spacing:.12em;font-weight:700}
.dossier__body{display:grid;grid-template-columns:minmax(200px,300px) 1fr;background:var(--panel)}
.dossier__photo{position:relative;background:var(--red);padding:10px;overflow:hidden}
.dossier__photo img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(.92)}
.dossier__glass{
  position:absolute;inset:10px;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.03) 34%,transparent 55%),
             repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 3px,rgba(0,0,0,.14) 3px 4px);
  mix-blend-mode:screen;
}
.dossier__stamps{position:absolute;left:14px;bottom:14px;display:flex;flex-direction:column;gap:.2rem;font-size:.52rem;letter-spacing:.14em;color:rgba(255,255,255,.85)}
.dossier__data{padding:1.2rem 1.4rem 1.5rem;color:var(--panel-ink)}
.dossier__file{
  font-family:var(--display);font-size:clamp(1.1rem,2.6vw,2rem);letter-spacing:-.02em;
  background:var(--panel-2);padding:.5rem .8rem;margin-bottom:1rem;
}
.fields{display:flex;flex-direction:column;gap:.42rem;font-size:.8rem;letter-spacing:.04em}
.fields span{color:#6d6857}
.fields b{color:var(--panel-ink)}
.fields .ok{color:#1c7a3e}
.barcode{height:34px;margin-top:1.1rem;background:repeating-linear-gradient(90deg,var(--panel-ink) 0 2px,transparent 2px 5px,var(--panel-ink) 5px 6px,transparent 6px 11px)}
@media (max-width:760px){.dossier__body{grid-template-columns:1fr}.dossier__photo{aspect-ratio:4/5}}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.steps li{background:rgba(11,12,15,.90);padding:1.1rem 1.15rem 1.3rem}
.steps__n{display:block;color:var(--red);font-size:1.5rem;font-weight:700;margin-bottom:.4rem}
.steps h3{font-size:.86rem;letter-spacing:.06em;margin-bottom:.45rem}
.steps p{font-size:.82rem;color:#b0a999}

/* ---------- ЦЕНЫ ---------- */
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.price{background:rgba(11,12,15,.90);padding:1.3rem 1.2rem 1.5rem;display:flex;flex-direction:column;gap:.7rem}
.price--accent{background:rgba(232,54,42,.1);outline:1px solid var(--red);outline-offset:-1px}
.price h3{font-size:.84rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.price__num{font-family:var(--display);font-size:clamp(1.3rem,2.6vw,1.9rem);letter-spacing:-.02em}
.price__num span{font-size:.7em}
.price ul{display:flex;flex-direction:column;gap:.42rem;font-size:.82rem;color:#b0a999}
.price li::before{content:"— ";color:var(--red)}

.care{border:1px solid var(--line-hard);padding:1.3rem;display:grid;grid-template-columns:minmax(240px,1fr) 1.2fr;gap:1.6rem;background:rgba(12,13,16,.55)}
.care__head h3{font-size:1.05rem;margin:.4rem 0 .6rem}
.care__head p{font-size:.85rem;color:#b0a999}
.care__tiers{display:flex;flex-direction:column;gap:.7rem}
.tier{display:grid;grid-template-columns:auto 1fr;gap:.2rem 1rem;align-items:baseline;border-bottom:1px dashed var(--line-hard);padding-bottom:.6rem;font-size:var(--hud);letter-spacing:.12em}
.tier b{font-family:var(--display);font-size:1.2rem;letter-spacing:-.02em;grid-column:2;grid-row:1}
.tier i{grid-column:2;font-style:normal;color:var(--dim);font-size:.76rem;letter-spacing:.02em}
@media (max-width:760px){.care{grid-template-columns:1fr}}

/* ---------- КОНТАКТ ---------- */
.contact{display:grid;grid-template-columns:1.4fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.contact__main,.contact__alt{background:rgba(11,12,15,.90);padding:1.4rem 1.3rem;display:flex;flex-direction:column;gap:.5rem;transition:background .25s var(--ease)}
.contact__main:hover{background:rgba(232,54,42,.12)}
.contact__alt:hover{background:rgba(246,237,215,.06)}
.contact__main b{font-family:var(--display);font-size:clamp(1.3rem,3.2vw,2.1rem);letter-spacing:-.02em}
.contact__alt b{font-size:.95rem;word-break:break-all}
.contact__go{color:var(--red);font-size:var(--hud);letter-spacing:.16em}
@media (max-width:640px){.contact{grid-template-columns:1fr}}

.faq-title{font-size:var(--hud);letter-spacing:.18em;color:var(--dim)}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;padding:.85rem .2rem;font-size:.88rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--red);font-weight:700}
.faq details[open] summary::after{content:"−"}
.faq summary:hover{color:var(--red-hot)}
.faq p{padding:0 .2rem .95rem;font-size:.85rem;color:#b0a999;max-width:78ch}

.legal{font-size:.66rem;line-height:1.7;letter-spacing:.04em;border-top:1px solid var(--line);padding-top:1rem;display:flex;flex-direction:column;gap:.5rem}

/* ============ BOOT ============ */
#boot{
  position:fixed;inset:0;z-index:60;background:#050506;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .7s var(--ease),visibility .7s;
}
#boot.is-done{opacity:0;visibility:hidden;pointer-events:none}
.boot__center{display:flex;flex-direction:column;align-items:center;gap:1.1rem;width:min(92vw,440px)}
#boot-sig{width:130px;height:130px;opacity:.9}
#boot-log{
  margin:0;font-size:.72rem;line-height:1.9;letter-spacing:.1em;color:var(--dim);
  min-height:8.5em;width:100%;white-space:pre-wrap;
}
#boot-log b{color:var(--ink);font-weight:400}
.boot__bar{width:100%;height:3px;background:rgba(246,237,215,.12);overflow:hidden}
.boot__bar i{display:block;height:100%;width:0;background:var(--red);transition:width .35s var(--ease)}
#boot-enter{margin-top:.3rem;min-width:180px}
.boot__corner{position:fixed;font-size:var(--hud);letter-spacing:.2em;color:var(--faint)}
.boot__corner--tl{top:1.2rem;left:1.4rem}
.boot__corner--br{bottom:1.2rem;right:1.4rem}

/* ============ КУРСОР ============ */
#cursor{position:fixed;top:0;left:0;z-index:90;width:16px;height:20px;pointer-events:none;display:none;
  transform:translate3d(-100px,-100px,0);transition:opacity .2s}
#cursor svg{width:100%;height:100%;filter:drop-shadow(0 0 4px rgba(0,0,0,.9))}
#cursor path{fill:var(--red);stroke:#fff;stroke-width:1.1;transition:fill .18s var(--ease)}
#cursor.is-hot path{fill:#fff;stroke:var(--red)}
#cursor{transition:opacity .2s,transform .04s linear}
#cursor.is-over svg{transform:scale(1.45)}
#cursor svg{transition:transform .18s var(--ease);transform-origin:2px 2px}
#cursor.is-over path{fill:#fff;stroke:var(--red)}
@media (pointer:fine){
  html.has-cursor,html.has-cursor *{cursor:none !important}
  #cursor{display:block}
}

/* ============ ПЕРЕХОД ============
   Глитч в шейдере накрывает только canvas. Если DOM-слой оставить
   неподвижным, чистый текст поверх рваной картинки сразу выдаёт трюк —
   поэтому на время перехода трясём и его. */
.is-glitching #screens{animation:domGlitch .13s steps(2) infinite}
.is-glitching .screen{
  filter:saturate(1.35);
  text-shadow:1.5px 0 rgba(232,54,42,.65),-1.5px 0 rgba(90,190,255,.55);
}
.is-glitching .hud-top,.is-glitching .hud-bottom{animation:domGlitch .19s steps(2) infinite}
@keyframes domGlitch{
  0%{transform:translate3d(0,0,0)}
  25%{transform:translate3d(-7px,1px,0)}
  50%{transform:translate3d(5px,-2px,0)}
  75%{transform:translate3d(-3px,2px,0)}
  100%{transform:translate3d(0,0,0)}
}
@media (prefers-reduced-motion:reduce){
  .is-glitching #screens,.is-glitching .hud-top,.is-glitching .hud-bottom{animation:none}
}