:root{--bg1:#0b0616;--bg2:#231046;--ink:#f4f0ff;--a1:#ff4fa3;--a2:#7c5cff;--bt:#fff;--rad:24px;--fh:"Unbounded";--fb:"Manrope";--mw:1100px;--cc:255,255,255;--ca:.08;--bc:255,255,255;--ba:.14}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);font:400 16px/1.55 var(--fb),system-ui,sans-serif;min-height:100vh}
#bgfx{position:fixed;inset:-20px;z-index:-2;background-size:cover;background-position:center;display:none}
#bgov{position:fixed;inset:0;z-index:-1;display:none}
h1,h2,h3{font-family:var(--fh),system-ui,sans-serif;margin:0;line-height:1.1}
a{color:inherit}
.wrap{max-width:var(--mw);margin:0 auto;padding:16px 16px 60px}
nav{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:flex-end;padding:10px 0;font-weight:700}
nav a{text-decoration:none;opacity:.8}nav a:hover,nav a.on{opacity:1;text-decoration:underline;text-underline-offset:5px}
header{padding:40px 0 24px;display:flex;flex-direction:column;align-items:center;text-align:center}
h1{font-size:clamp(34px,9vw,80px);letter-spacing:-.03em}
h1 .g{background:linear-gradient(90deg,var(--a1),var(--a2));-webkit-background-clip:text;background-clip:text;color:transparent}
header p{max-width:46ch;margin:16px 0 0;font-size:1.1em;opacity:.85}
.btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:20px}
.pill{display:inline-block;padding:10px 20px;border-radius:999px;text-decoration:none;font-weight:700;color:var(--ink);background:rgba(var(--cc),var(--ca));border:1px solid rgba(var(--bc),var(--ba));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.pill.main{background:linear-gradient(90deg,var(--a1),var(--a2));color:var(--bt);border-color:transparent}
section{margin-top:56px}
h2{font-size:clamp(22px,4vw,32px);margin-bottom:20px}
.card{background:rgba(var(--cc),var(--ca));border:1px solid rgba(var(--bc),var(--ba));border-radius:var(--rad);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:hidden}
.about{display:grid;grid-template-columns:minmax(0,240px) 1fr;gap:24px;align-items:center;padding:20px}
.about .ph{aspect-ratio:1;border-radius:calc(var(--rad) * .8);display:grid;place-items:center;font-size:88px;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--a1) 35%,transparent),color-mix(in srgb,var(--a2) 35%,transparent))}
.about img{width:100%;height:100%;object-fit:cover}
.about p{margin:0 0 12px;white-space:pre-line;max-width:60ch}
@media(max-width:640px){.about{grid-template-columns:1fr}.about .ph{max-width:200px}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:18px}
.item{display:flex;flex-direction:column;text-decoration:none;transition:transform .2s}
.item:hover{transform:translateY(-4px)}
.pic{aspect-ratio:1;display:grid;place-items:center;font-size:72px;background:linear-gradient(135deg,color-mix(in srgb,var(--a1) 30%,transparent),color-mix(in srgb,var(--a2) 30%,transparent))}
.pic img{width:100%;height:100%;object-fit:cover}
.info{padding:12px 14px 16px}.info h3{font-size:15px}.info .pr{margin-top:6px;font-weight:800}.info s{opacity:.5;font-weight:400}.info .st{margin-top:6px;opacity:.8;font-weight:700;font-size:.92em}
.more{display:inline-block;margin-top:20px;font-weight:800;text-decoration:underline;text-underline-offset:5px}
.authors{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:16px}
.au{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:18px 12px}
.au .av{width:84px;height:84px;border-radius:50%;overflow:hidden;display:grid;place-items:center;font:800 32px var(--fh),sans-serif;color:var(--bt);background:linear-gradient(135deg,var(--a1),var(--a2))}
.au .av img{width:100%;height:100%;object-fit:cover}
.au b{font-size:15px}.au small{opacity:.7}
.big .au{align-items:flex-start;text-align:left;padding:20px}
.empty{opacity:.7}
footer{margin-top:56px;text-align:center;opacity:.7;font-size:.9em}
:focus-visible{outline:3px solid var(--a2);outline-offset:2px}

.soc{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.soc-a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;text-decoration:none;color:var(--ink);background:rgba(var(--cc),var(--ca));border:1px solid rgba(var(--bc),var(--ba));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:background .2s,color .2s,transform .2s}
.soc-a:hover{background:linear-gradient(135deg,var(--a1),var(--a2));color:var(--bt);transform:translateY(-2px)}
.soc-a svg{width:22px;height:22px}.soc-a img{width:24px;height:24px;object-fit:contain}
.au .soc{gap:6px;margin-top:4px}.au .soc-a{width:34px;height:34px}.au .soc-a svg{width:18px}
.big .au .bio{white-space:pre-line}
header .soc{margin-top:18px}
footer .soc{margin-bottom:14px}

/* Градиент фона лежит на html, а не на body: иначе body закрывает фоновую картинку (#bgfx) и она не видна */
html{background:var(--bg2);background:radial-gradient(50% 40% at 12% 8%,color-mix(in srgb,var(--a1) var(--glow,40%),transparent),transparent),radial-gradient(45% 40% at 92% 30%,color-mix(in srgb,var(--a2) var(--glow,40%),transparent),transparent),linear-gradient(var(--ang,160deg),var(--bg1),var(--bg2));background-attachment:fixed}
.authors .empty{grid-column:1/-1}

.pill.main{background:linear-gradient(90deg,#ffa04a,#ffc15a);color:#2b2530}
