

:root{
  --x-blue:#3054FF; --x-red:#F9423A; --x-bg:#070715;
  --x-ink:#EEF4FA; --x-dim:rgba(238,244,250,.72);
  --x-faint:rgba(238,244,250,.5); --x-hair:rgba(238,244,250,.14);
  --x-card:#0B0B1C;
  --x-bevel:15px;
  --x-ease:cubic-bezier(.22,.61,.36,1);
  --t-xs:clamp(12.5px,1.02vw,15px);
  --t-s:clamp(15px,1.26vw,18px);
  --t-m:clamp(16.5px,1.32vw,19px);
  --t-l:clamp(20px,1.8vw,26px);
  --t-h:clamp(28px,3.4vw,46px);
  --pad:clamp(16px,5vw,64px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--x-bg);color:var(--x-ink);
  font-family:'Montserrat',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:var(--t-m);font-weight:300;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}

.top{
  position:sticky;top:0;z-index:10;
  display:flex;align-items:center;justify-content:space-between;
  gap:clamp(16px,3vw,40px);
  padding:clamp(14px,1.8vh,22px) var(--pad);
  background:rgba(7,7,21,.86);backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--x-hair);
}
.top__logo{display:flex;align-items:center;text-decoration:none}
.top__logo img{height:clamp(26px,3.2vw,44px);width:auto;display:block}

.top__back{
  flex:none;font-size:var(--t-s);color:var(--x-ink);text-decoration:none;
  border-bottom:1px solid rgba(238,244,250,.34);padding-bottom:2px;
  transition:border-color .3s var(--x-ease),color .3s var(--x-ease);
}
.top__back:hover{color:#fff;border-bottom-color:#fff}
@media (max-width:620px){
  .top{gap:12px}
  .top__back{font-size:var(--t-xs)}
}

.page{max-width:1240px;margin:0 auto;padding:clamp(30px,6vh,64px) var(--pad) clamp(60px,10vh,110px)}
.page__k{
  margin:0 0 clamp(10px,1.4vh,16px);font-size:var(--t-xs);
  letter-spacing:.14em;text-transform:uppercase;color:var(--x-faint);
}
h1{
  margin:0 0 clamp(10px,1.6vh,18px);
  font-size:var(--t-h);font-weight:300;line-height:1.1;letter-spacing:-.01em;
}
.page__lead{margin:0 0 clamp(28px,4.4vh,48px);max-width:60ch;font-size:var(--t-l);line-height:1.42;color:var(--x-dim)}


.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  min-height:44px;padding:.62em 1.25em;
  font:inherit;font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;
  color:#fff;background:var(--x-blue);border:0;cursor:pointer;text-decoration:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
  transition:background .25s var(--x-ease),opacity .25s var(--x-ease);
}
.btn:hover{background:#4A6BFF}
.btn:disabled{opacity:.38;cursor:default}
.btn--ghost{background:transparent;color:var(--x-ink);box-shadow:inset 0 0 0 1px rgba(238,244,250,.32);clip-path:none}
.btn--ghost:hover{background:rgba(238,244,250,.06)}
.btn svg{width:1.15em;height:1.15em;flex:none}

.ft{
  padding:clamp(26px,4vh,40px) var(--pad);
  border-top:1px solid var(--x-hair);background:#040410;
  font-size:var(--t-xs);color:var(--x-faint);
}
.ft__in{max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;
  gap:.4em clamp(14px,2vw,26px);align-items:center}
.ft a{color:var(--x-faint);text-decoration:none;border-bottom:1px solid rgba(238,244,250,.24)}
.ft a:hover{color:var(--x-ink)}


.files{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:clamp(14px,1.6vw,22px)}
.file{
  display:flex;flex-direction:column;background:var(--x-card);border:1px solid var(--x-hair);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--x-bevel)),calc(100% - var(--x-bevel)) 100%,0 100%);
}
.file__cover{
  position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#000;
  border-bottom:1px solid var(--x-hair);cursor:pointer;
}
.file__cover img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;
  transition:transform .6s var(--x-ease)}
.file__cover:hover img{transform:scale(1.03)}
.file__type{
  position:absolute;left:12px;top:12px;padding:.2em .55em;
  font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:#fff;background:rgba(7,7,21,.78);border:1px solid rgba(238,244,250,.22);
}
.file__play{
  position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;
  background:rgba(48,84,255,.92);display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 8px rgba(48,84,255,.18);
}
.file__play svg{width:24px;height:24px;margin-left:4px;fill:#fff}
.file__body{display:flex;flex-direction:column;gap:.35em;padding:clamp(16px,2vh,22px) clamp(16px,1.6vw,22px) 0;flex:1}
.file__title{margin:0;font-size:var(--t-s);font-weight:500;line-height:1.3}
.file__who{margin:0;font-size:var(--t-xs);color:var(--x-dim);line-height:1.4}
.file__meta{margin:auto 0 0;padding-top:.6em;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--x-faint)}
.file__acts{display:flex;gap:10px;padding:clamp(14px,1.8vh,18px) clamp(16px,1.6vw,22px) clamp(18px,2.2vh,24px)}
.file__acts .btn{flex:1}


.lb{
  position:fixed;inset:0;z-index:50;display:none;
  background:rgba(4,4,16,.94);backdrop-filter:blur(6px);
}
.lb[open],.lb.is-open{display:flex;flex-direction:column}
.lb__bar{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:12px var(--pad);color:var(--x-dim);font-size:var(--t-xs);
}
.lb__acts{display:flex;gap:10px;align-items:center}
.lb__stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;
  padding:0 clamp(8px,4vw,72px) clamp(12px,3vh,32px);position:relative}
.lb__stage img,.lb__stage video{max-width:100%;max-height:100%;display:block;object-fit:contain;background:#000}
.lb__x{
  width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid rgba(238,244,250,.3);color:#fff;cursor:pointer;font-size:22px;line-height:1;
}
.lb__x:hover{background:rgba(238,244,250,.08)}
.lb__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:72px;border:0;cursor:pointer;
  background:rgba(7,7,21,.55);color:#fff;font-size:28px;
}
.lb__nav:hover{background:rgba(48,84,255,.7)}
.lb__nav--prev{left:clamp(4px,1vw,16px)}
.lb__nav--next{right:clamp(4px,1vw,16px)}
@media (max-width:620px){
  .lb__nav{width:40px;height:56px;font-size:22px}
}


.gal__bar{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;
  margin:0 0 clamp(18px,2.4vh,26px)}
.gal__count{font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--x-faint)}
.gal{columns:4 260px;column-gap:clamp(8px,1vw,14px)}
.gal a{display:block;margin:0 0 clamp(8px,1vw,14px);break-inside:avoid;background:#0B0B1C;overflow:hidden;cursor:zoom-in}
.gal img{width:100%;height:auto;display:block;transition:transform .6s var(--x-ease),opacity .3s}
.gal a:hover img{transform:scale(1.03)}
.gal__empty{padding:clamp(40px,8vh,90px) 0;color:var(--x-dim);font-size:var(--t-l)}


.page--narrow{max-width:720px}
.sv h1{font-size:clamp(28px,3vw,40px)}
.sv h2{margin:0 0 .35em;font-size:var(--t-l);font-weight:500;line-height:1.25;text-wrap:balance}
.sv-lead{margin:0 0 clamp(14px,2vh,20px);color:var(--x-dim);font-size:var(--t-s);line-height:1.5}
.sv-lead a,.sv-row a{color:#8AA0FF;text-decoration:none;border-bottom:1px solid rgba(138,160,255,.42)}
.sv-intro{margin:clamp(18px,3vh,30px) 0;padding:clamp(18px,2.6vh,26px) clamp(18px,2vw,26px);
  background:radial-gradient(120% 140% at 12% 0%,rgba(48,84,255,.28),transparent 60%),var(--x-card);
  border:1px solid var(--x-hair);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--x-bevel)),calc(100% - var(--x-bevel)) 100%,0 100%)}
.sv-intro p{margin:0;color:var(--x-dim);font-size:var(--t-xs)}
.sv-prog{height:3px;background:var(--x-hair);margin:0 0 clamp(18px,2.6vh,28px)}
.sv-prog i{display:block;height:100%;background:linear-gradient(90deg,var(--x-blue),var(--x-red));transition:width .35s var(--x-ease)}

.sv-scale{display:flex;gap:6px;margin:clamp(10px,1.6vh,16px) 0 6px}
.sv-scale button{
  flex:1;min-width:0;height:clamp(44px,6vh,54px);
  font:inherit;font-size:var(--t-s);font-weight:600;color:var(--x-ink);
  background:var(--x-card);border:1px solid var(--x-hair);cursor:pointer;
  transition:border-color .2s var(--x-ease),background .2s var(--x-ease);
}
.sv-scale button:hover{border-color:var(--x-blue)}
.sv-scale button.on{background:var(--x-blue);border-color:var(--x-blue);color:#fff}
.sv-scale--nps{gap:4px}
.sv-scale--nps button{font-size:var(--t-xs)}
.sv-scale__l{display:flex;justify-content:space-between;gap:12px;margin:0 0 clamp(22px,3.4vh,34px);
  font-size:12px;color:var(--x-faint)}

.sv textarea,.sv input[type=text]{
  display:block;width:100%;margin:0 0 clamp(14px,2vh,20px);padding:12px 14px;
  font:inherit;font-size:var(--t-s);color:var(--x-ink);
  background:var(--x-card);border:1px solid var(--x-hair);border-radius:0;resize:vertical;
}
.sv textarea{min-height:96px}
.sv textarea::placeholder,.sv input::placeholder{color:rgba(238,244,250,.36)}
.sv textarea:focus,.sv input:focus{outline:2px solid var(--x-blue);outline-offset:-1px}

.sv-chips{display:flex;flex-direction:column;gap:8px}
.sv-chip,.sv-row{
  display:flex;align-items:center;gap:12px;width:100%;padding:14px;
  font:inherit;color:var(--x-ink);text-align:left;cursor:pointer;
  background:var(--x-card);border:1px solid var(--x-hair);
  transition:border-color .2s var(--x-ease),background .2s var(--x-ease);
}
.sv-chip:hover,.sv-row:hover{border-color:rgba(48,84,255,.6)}
.sv-chip.on,.sv-row.on{border-color:var(--x-blue);background:rgba(48,84,255,.14)}
.sv-row{align-items:flex-start;margin:0 0 14px;font-size:var(--t-s)}
.sv-box{flex:none;width:20px;height:20px;display:flex;align-items:center;justify-content:center;
  font-size:13px;border:1.5px solid var(--x-faint);color:#fff}
.on>.sv-box{background:var(--x-blue);border-color:var(--x-blue)}
.sv-chip__t{min-width:0}
.sv-chip__t b,.sv-card b{display:block;font-size:var(--t-s);font-weight:600;line-height:1.3}
.sv-chip__t span{display:block;margin-top:3px;font-size:12.5px;color:var(--x-faint);line-height:1.4}
.sv-chip__t .sv-desc,.sv-card .sv-desc{color:var(--x-dim)}
.sv-card .sv-desc{display:block;margin:4px 0 2px;font-size:13px;line-height:1.4}
.sv-ava{display:flex;flex:none}
.sv-ava img{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:top;
  border:2px solid var(--x-card);background:#171b38;margin-left:-10px;position:relative}
.sv-ava img:first-child{margin-left:0}
.sv-chip.on .sv-ava img{border-color:#121638}
.sv-card{margin:0 0 14px;padding:16px;background:var(--x-card);border:1px solid var(--x-hair)}
.sv-card .sv-ava{margin:0 0 12px}
.sv-card .sv-ava img{width:42px;height:42px}
.sv-spk{display:block;font-size:12.5px;color:var(--x-faint);line-height:1.4}
.sv-card textarea{margin:12px 0 0;min-height:72px}
.sv-fields{margin:4px 0 0}

.sv-hint{margin:12px 0 0;font-size:13px;color:var(--x-faint)}
.sv-err{margin:12px 0 0;padding:10px 12px;font-size:var(--t-xs);color:#ffb3af;
  background:rgba(249,66,58,.1);border:1px solid rgba(249,66,58,.4)}
.sv-nav{display:flex;gap:10px;margin-top:clamp(22px,3.4vh,34px)}
.sv-nav .btn{flex:1;min-height:52px;font-size:var(--t-s)}
.sv-nav .btn--ghost{flex:0 0 auto;padding-inline:1.5em}
.sv-done{text-align:center;padding-top:clamp(30px,8vh,90px)}
.sv-done__ok{width:64px;height:64px;margin:0 auto 22px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;font-size:28px;color:#fff;background:var(--x-blue);box-shadow:0 0 0 10px rgba(48,84,255,.16)}
@media (max-width:480px){
  .sv-scale--nps{flex-wrap:wrap}
  .sv-scale--nps button{flex:0 0 calc((100% - 20px) / 6);height:44px}
}
.sv-chip--radio .sv-box{border-radius:50%}
