:root{
  --bg:#090d12;
  --bg2:#111820;
  --panel:#121a23;
  --panel2:#0f151c;
  --line:rgba(139,188,225,.18);
  --line-strong:rgba(139,188,225,.34);
  --blue:#83bee4;
  --blue-bright:#c6e7ff;
  --cream:#f5efe8;
  --muted:#a8b1b9;
  --gold:#e7b25d;
  --orange:#ce7a2e;
  --danger:#e5a968;
  --shadow:0 30px 80px rgba(0,0,0,.48);
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg);scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--cream);
  background:
    radial-gradient(circle at 14% 8%,rgba(69,120,154,.13),transparent 27%),
    radial-gradient(circle at 88% 78%,rgba(190,117,47,.08),transparent 24%),
    linear-gradient(145deg,#080c11 0%,#0b1117 48%,#080b10 100%);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Verdana,Arial,sans-serif;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:-1;
  background-image:
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 85%);
}
.page-noise{position:fixed;inset:0;pointer-events:none;opacity:.16;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.ambient{position:fixed;border-radius:50%;filter:blur(90px);pointer-events:none;opacity:.22;z-index:-1}
.ambient-one{width:430px;height:430px;left:-180px;top:90px;background:#447da5}
.ambient-two{width:340px;height:340px;right:-130px;bottom:40px;background:#9d5a24;opacity:.14}
.farewell-shell{width:min(1420px,calc(100% - 48px));margin:0 auto;padding:48px 0 60px}
.farewell-window{
  position:relative;overflow:hidden;border:1px solid var(--line-strong);border-radius:24px;
  background:linear-gradient(180deg,rgba(20,29,39,.985),rgba(11,16,22,.995));
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.05);
}
.farewell-window:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#3c789f,var(--blue),#d6a453,#9a5c28);opacity:.95}
.cms-bar{height:72px;padding:0 26px 0 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(139,188,225,.13);background:linear-gradient(180deg,rgba(27,39,51,.96),rgba(15,22,29,.92))}
.brand-lockup{display:flex;align-items:center;gap:14px;min-width:0}
.brand-frame{display:flex;align-items:center;padding:8px 11px 7px;border:1px solid rgba(159,205,238,.18);border-radius:9px;background:rgba(2,8,13,.34);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.brand-frame img{display:block;width:124px;height:auto;image-rendering:auto}
.brand-divider{width:1px;height:24px;background:rgba(255,255,255,.12)}
.brand-product{text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:800;color:#94a8b8;white-space:nowrap}
.window-controls{display:flex;gap:8px}.window-controls span{width:10px;height:10px;border-radius:3px;background:#385064;border:1px solid rgba(255,255,255,.08)}.window-controls span:nth-child(2){background:#76613f}.window-controls span:nth-child(3){background:#7c4636}
.farewell-content{display:grid;grid-template-columns:minmax(0,1.36fr) minmax(320px,.64fr);gap:72px;align-items:center;padding:78px clamp(34px,6vw,90px) 62px}
.farewell-copy{min-width:0;position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:9px;margin-bottom:22px;color:#9db3c3;font-size:11px;font-weight:900;letter-spacing:.16em}.eyebrow-dot{width:8px;height:8px;border-radius:2px;background:var(--gold);box-shadow:0 0 0 4px rgba(231,178,93,.08),0 0 18px rgba(231,178,93,.2)}
h1{margin:0;max-width:880px;font-size:clamp(58px,7.6vw,116px);line-height:.89;letter-spacing:-.062em;font-weight:900;color:var(--cream);text-wrap:balance}
h1 span{display:block;color:transparent;background:linear-gradient(100deg,#d6efff 0%,#8fc6e8 58%,#e5b15d 120%);-webkit-background-clip:text;background-clip:text;text-shadow:0 18px 48px rgba(96,159,201,.08)}
.intro-line{margin:24px 0 34px;font-size:18px;color:#9eabb6;letter-spacing:-.01em}
.message-card{position:relative;border:1px solid rgba(139,188,225,.17);border-radius:18px;overflow:hidden;background:linear-gradient(145deg,rgba(19,28,37,.96),rgba(10,15,20,.98));box-shadow:0 22px 48px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035)}
.message-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(to bottom,var(--blue),#508aaf 55%,var(--gold));opacity:.85}
.message-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px 19px 30px;border-bottom:1px solid rgba(139,188,225,.11);background:linear-gradient(90deg,rgba(85,137,173,.10),rgba(255,255,255,.012))}.message-head>div{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap}.message-kicker{font-size:10px;letter-spacing:.18em;font-weight:900;color:#86b8d7}.message-head strong{font-size:14px;color:#e9eef1}.pixel-heart{font-family:Arial,sans-serif;color:#d79d54;font-size:19px;filter:drop-shadow(0 0 12px rgba(215,157,84,.16))}
.message-body{padding:26px 30px 28px;font-size:15.5px;line-height:1.74;color:#cbd0d4}.message-body p{margin:0 0 17px}.message-body p:last-child{margin-bottom:0}.important-note{margin:23px -4px!important;padding:15px 17px;border:1px solid rgba(224,160,83,.18);border-radius:12px;background:linear-gradient(100deg,rgba(196,117,43,.10),rgba(196,117,43,.025));color:#eedecb!important}.signature{font-size:18px;font-weight:800;color:#f1ece5!important;letter-spacing:-.02em;padding-top:2px}
.avatar-column{position:relative;min-height:720px;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1}
.avatar-halo{position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(97,158,199,.13),rgba(97,158,199,.045) 38%,transparent 70%);filter:blur(4px)}
.avatar-panel{position:relative;width:min(100%,410px);aspect-ratio:4/5.5;display:flex;align-items:flex-end;justify-content:center;border:1px solid rgba(139,188,225,.20);border-radius:26px;background:linear-gradient(180deg,rgba(35,49,62,.66),rgba(12,18,24,.18));box-shadow:0 28px 60px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05);overflow:hidden}
.avatar-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(147,199,234,.07),transparent 30%),repeating-linear-gradient(0deg,transparent 0 27px,rgba(255,255,255,.014) 28px),repeating-linear-gradient(90deg,transparent 0 27px,rgba(255,255,255,.014) 28px);mask-image:linear-gradient(to bottom,#000,transparent 88%)}
.avatar-panel:after{content:"";position:absolute;left:8%;right:8%;bottom:5%;height:18%;border-radius:50%;background:radial-gradient(ellipse,rgba(210,151,75,.09),transparent 70%);filter:blur(8px)}
.avatar-panel-top{position:absolute;top:17px;left:17px;display:flex;gap:6px}.avatar-panel-top span{width:7px;height:7px;border-radius:2px;background:#486477}.avatar-panel-top span:nth-child(2){background:#8a7248}.avatar-panel-top span:nth-child(3){background:#81503d}
.farewell-avatar{position:relative;z-index:2;height:92%;width:auto;max-width:118%;transform:translateY(-1%);image-rendering:auto;filter:drop-shadow(0 20px 18px rgba(0,0,0,.35))}
.avatar-shadow{position:absolute;z-index:1;bottom:27px;width:55%;height:24px;border-radius:50%;background:rgba(0,0,0,.34);filter:blur(10px)}
.goodbye-chip{margin-top:18px;display:inline-flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid rgba(139,188,225,.16);border-radius:999px;background:rgba(12,18,24,.74);color:#a9b7c1;font-size:12px;font-weight:700;box-shadow:0 10px 24px rgba(0,0,0,.16)}.tiny-wave{filter:grayscale(.25);font-size:14px}
.farewell-footer{min-height:62px;padding:0 30px;display:flex;align-items:center;justify-content:center;gap:10px;border-top:1px solid rgba(139,188,225,.10);background:#0b1117;color:#71808c;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.footer-dot{color:#c9924b}
@media(max-width:1080px){.farewell-content{grid-template-columns:1fr;gap:42px;padding-top:60px}.avatar-column{min-height:0;order:-1}.avatar-panel{width:300px;aspect-ratio:4/5}.farewell-avatar{height:92%;width:auto;max-width:114%;transform:translateY(-1%)}h1{text-align:center;margin-inline:auto}.eyebrow{display:flex;justify-content:center}.intro-line{text-align:center}.avatar-halo{width:340px;height:340px}}
@media(max-width:720px){.farewell-shell{width:min(100% - 20px,680px);padding:12px 0 20px}.farewell-window{border-radius:18px}.cms-bar{height:62px;padding:0 15px}.brand-frame{padding:6px 8px}.brand-frame img{width:98px}.brand-divider,.brand-product,.window-controls{display:none}.farewell-content{padding:34px 16px 32px;gap:30px}.avatar-panel{width:232px;border-radius:20px}.avatar-column{padding-top:2px}.goodbye-chip{margin-top:12px;font-size:11px}.eyebrow{margin-bottom:15px;font-size:10px}h1{font-size:clamp(48px,15vw,72px);line-height:.91}.intro-line{font-size:15px;margin:18px 0 24px}.message-card{border-radius:15px}.message-head{padding:17px 16px 15px 21px}.message-body{padding:20px 19px 23px;font-size:14.5px;line-height:1.7}.message-head>div{gap:6px 9px}.farewell-footer{padding:0 14px;min-height:56px;font-size:9px;letter-spacing:.08em;gap:7px}.avatar-halo{width:270px;height:270px}}
@media(max-width:420px){.farewell-shell{width:100%;padding:0}.farewell-window{border-radius:0;border-left:0;border-right:0;min-height:100vh}.avatar-panel{width:205px}.message-body{font-size:14px}.farewell-footer{flex-wrap:wrap;text-align:center;line-height:1.5;padding-block:15px}.footer-dot{display:none}.farewell-footer span{width:100%}}
@media(prefers-reduced-motion:no-preference){.farewell-window{animation:windowIn .72s cubic-bezier(.16,.9,.24,1) both}.avatar-panel{animation:avatarFloat 5.8s ease-in-out 1s infinite}.farewell-avatar{animation:avatarIn .82s .18s cubic-bezier(.16,.9,.24,1) both}.message-card{animation:cardIn .72s .15s cubic-bezier(.16,.9,.24,1) both}@keyframes windowIn{from{opacity:0;transform:translateY(12px) scale(.994)}to{opacity:1;transform:none}}@keyframes cardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes avatarIn{from{opacity:0;transform:translateY(8%) scale(.97)}to{opacity:1;transform:translateY(-1%) scale(1)}}@keyframes avatarFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}}
