@font-face{font-family:Manrope;src:url('assets/manrope-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/manrope-bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;font-family:Manrope,Arial,sans-serif;color:#f5eef9;background:#09070e;--red:#ff4269;--violet:#b26cff}
*{box-sizing:border-box}
body{margin:0;min-width:280px;min-height:100svh;background:radial-gradient(ellipse at 22% 25%,#390c1c80,transparent 52%),radial-gradient(ellipse at 82% 42%,#29104490,transparent 50%),#09070e}
.ambient{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 49.9%,#ffffff04 50%,transparent 50.1%);}
.page{isolation:isolate;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100svh;padding:32px 18px 20px;overflow:hidden}
.halo{position:absolute;z-index:-1;top:12%;left:50%;width:min(820px,140vw);aspect-ratio:1;border-radius:50%;transform:translateX(-50%) rotate(-20deg);border:1px solid #b26cff28;border-left-color:#ff426964;border-right-color:#b26cff77;box-shadow:-24px 0 100px -65px #ff4269,24px 0 100px -65px #b26cff;pointer-events:none}
.halo::before,.halo::after{content:'';position:absolute;inset:24px;border:1px solid #b26cff0e;border-left-color:#ff426925;border-radius:50%}
.halo::after{inset:-35px;border-color:#ffffff04}
.profile{width:min(100%,440px);position:relative;padding:10px 10px 0;border:1px solid #e2c9ff19;border-radius:30px;background:linear-gradient(155deg,#27101a99,#120d19 49%,#1a1028);box-shadow:-18px 8px 75px #ff164518,18px 8px 75px #9244ff1a,0 28px 80px #0009}
.profile::before{content:'';height:1px;position:absolute;left:24px;right:24px;top:-1px;background:linear-gradient(90deg,transparent,#ff4269a6,#b26cffb3,transparent)}
.portrait-shell{position:relative;overflow:hidden;border-radius:21px;background:#15111b;isolation:isolate}
.portrait{display:block;width:100%;height:auto;aspect-ratio:1122/1402;object-fit:contain}
.photo-edge{position:absolute;inset:0;border-radius:inherit;border:1px solid #ffffff20;background:linear-gradient(90deg,#ff17451a,transparent 25% 75%,#8e36ff22),linear-gradient(0deg,#120d1977,transparent 22%);pointer-events:none}
.photo-monogram{position:absolute;right:15px;top:15px;border:1px solid #ffffff36;border-radius:100px;padding:7px 11px;background:#0e0a126b;backdrop-filter:blur(12px);font-size:12px;letter-spacing:.12em;color:#f5eef9}
.photo-monogram span{padding:0 5px;color:#e4caeb}
.photo-glint{position:absolute;inset:-100%;pointer-events:none;opacity:0;background:linear-gradient(120deg,transparent 43%,#ffa7c91a 47%,#fff8 50%,#c991ff1a 53%,transparent 57%);transform:translateX(-55%)}
.identity{text-align:center;padding:15px 4px 20px}
.ornament{display:flex;justify-content:center;align-items:center;gap:10px;color:#d7bfdf;font-size:16px;line-height:1;margin-bottom:8px}
.ornament span{height:1px;width:42px;background:linear-gradient(90deg,transparent,#ff426985)}
.ornament span:last-child{background:linear-gradient(90deg,#b26cff85,transparent)}
h1{margin:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;font-weight:700;font-size:clamp(1.65rem,7.5vw,2.3rem);line-height:1.25;white-space:nowrap}
h1 .nerina,h1 .hinano{font-family:Manrope,Arial,sans-serif;font-weight:700;letter-spacing:-.025em}
.nerina{color:#ff6585;text-shadow:0 0 25px #ff17454a}
.hinano{color:#c28bff;text-shadow:0 0 25px #a044ff4f}
.conjunction{font:400 .875rem Manrope,Arial,sans-serif;color:#b8acbf;letter-spacing:.015em;padding-top:3px}
.invitation{margin:9px 0 0;font-size:1rem;color:#c8bbd0;letter-spacing:.02em}
.telegram-link{position:relative;display:flex;align-items:center;gap:15px;padding:17px 19px;margin:0 10px;min-height:86px;text-decoration:none;color:#fff;border:1px solid #e9acff4a;border-radius:17px;background:radial-gradient(ellipse at 5% 0%,#ff527f36,transparent 65%),linear-gradient(105deg,#7d183a,#552773 66%,#532580);box-shadow:inset 0 1px 0 #fff2,0 8px 28px #0004;transition:transform .2s,box-shadow .2s,border-color .2s}
.telegram-icon{width:45px;height:45px;flex:0 0 45px;display:grid;place-items:center;border:1px solid #fff3;border-radius:50%;background:#ffffff12;box-shadow:inset 0 1px 8px #ffffff0d}
.telegram-icon svg{width:24px;height:24px;margin-left:-2px}
.button-copy{display:flex;flex-direction:column;gap:3px}
.button-eyebrow{font-size:.75rem;color:#efd4ed}
.button-copy strong{font-size:1.25rem;line-height:1.25;font-weight:700;letter-spacing:-.025em}
.button-arrow{margin-left:auto;font-size:25px;font-weight:400;color:#efdaf9}
.telegram-link:hover{transform:translateY(-2px);border-color:#e9acff9c;box-shadow:-8px 5px 24px #ff426926,8px 5px 24px #b26cff38,inset 0 1px 0 #fff3}
.telegram-link:focus-visible{outline:2px solid #f2c8ff;outline-offset:5px}
.telegram-link:active{transform:translateY(0) scale(.99)}
.note{text-align:center;font-size:.75rem;color:#ae9bb9;margin:16px 0 22px}
footer{margin-top:20px;font-size:.75rem;color:#887792;letter-spacing:.025em}
@media(min-width:700px) and (min-height:900px){.page{padding-top:40px;padding-bottom:30px}.profile{width:460px}}
@media(max-width:380px){.page{padding:14px 12px}.profile{padding:7px 7px 0;border-radius:25px}h1{gap:8px;font-size:1.65rem}.conjunction{font-size:.75rem}.telegram-link{margin:0 6px;padding:15px 13px;gap:12px}.note{font-size:.75rem}}
@media(prefers-reduced-motion:no-preference){.profile{animation:arrive .7s ease-out both}.photo-glint{animation:glint 2.6s 1s ease-in-out both}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes glint{0%{transform:translateX(-55%);opacity:0}25%,70%{opacity:.32}100%{transform:translateX(55%);opacity:0}}}
@media(prefers-reduced-motion:reduce){.telegram-link{transition:none}}