:is(#about #bentoContactCard,#contact #contactBentoCard).notification-stack-card{min-width:0;min-height:220px!important;box-shadow:0 6px 22px rgba(35,43,54,.045),inset 0 0 0 1px rgba(65,78,92,.065),inset 0 1px 0 rgba(255,255,255,.85);transition:box-shadow .7s cubic-bezier(.22,1,.36,1)}#contact #contactBentoCard.notification-stack-card{min-height:300px!important}:is(#about #bentoContactCard,#contact #contactBentoCard) .about-notifications{position:absolute;inset:0;display:block!important;width:100%;height:100%;min-width:0;overflow:hidden;container-type:size;isolation:isolate}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro{position:absolute;z-index:6;left:24px;bottom:22px;max-width:calc(100% - 48px);pointer-events:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro::before{content:"";position:absolute;z-index:-1;inset:-12px -24px -10px -12px;background:radial-gradient(ellipse at 30% 65%,rgba(255,255,255,.98),rgba(255,255,255,.88) 55%,transparent 78%);pointer-events:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro h3{margin:0;color:#48484e;font-family:var(--font-main);font-size:1.3rem;font-weight:550;line-height:1.2;letter-spacing:-.04em}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro p{margin:7px 0 0;color:#92969d;font-family:var(--font-main);font-size:.86rem;font-weight:400;line-height:1.4;letter-spacing:-.02em}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream{--notification-height:clamp(60px,26cqh,72px);--notification-gap:8px;--notification-step:calc(var(--notification-height) + var(--notification-gap));position:absolute;top:14px;right:18px;width:min(76%,360px);height:calc(100% - 88px);max-height:calc(3 * var(--notification-height) + 2 * var(--notification-gap));overflow:hidden;isolation:isolate}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream::after{content:"";position:absolute;z-index:5;inset:auto 0 0;height:42%;background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.88) 68%,#fff);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 45%);mask-image:linear-gradient(to bottom,transparent,#000 45%);opacity:.85;transition:opacity .65s cubic-bezier(.22,1,.36,1);pointer-events:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-list{position:relative;width:calc(100% - 14px);height:100%;margin:0 auto;padding:0;list-style:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification{position:absolute;inset:0 0 auto;display:flex;align-items:center;gap:11px;height:var(--notification-height);margin:0;padding:8px 13px;border:1px solid rgba(60,68,78,.08);border-radius:18px;background:#fff;box-shadow:0 2px 3px rgba(30,38,48,.025),0 6px 16px rgba(30,38,48,.035);color:#303237;font-family:var(--font-main);scale:1;transition:scale .8s cubic-bezier(.22,1,.36,1);transform-origin:50% 0;animation:aboutNotificationStack 12s cubic-bezier(.22,1,.36,1) infinite both;animation-play-state:paused;animation-delay:var(--notification-phase,0s)}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification:nth-child(2){--notification-phase:-3s;transform:translateY(var(--notification-step))}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification:nth-child(3){--notification-phase:-6s;transform:translateY(calc(2 * var(--notification-step)))}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification:nth-child(4){--notification-phase:-9s;transform:translateY(calc(3 * var(--notification-step)));opacity:0}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-icon{display:block;flex:0 0 40px;width:40px;height:40px;border-radius:12px;object-fit:cover;background:#f5f6f7}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-copy{flex:1;min-width:0}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-headline{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:6px;row-gap:1px}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-channel{color:#34363b;font-size:.88rem;font-weight:550;line-height:1.3;letter-spacing:-.025em}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-time{color:#8a919c;font-size:.62rem;font-weight:450;line-height:1.4;white-space:nowrap}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-time::before{content:"·";margin-right:5px}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-copy p{margin:3px 0 0;color:#777d85;font-size:.73rem;font-weight:400;line-height:1.35;letter-spacing:-.015em}:is(#about #bentoContactCard,#contact #contactBentoCard).is-notifications-running .contact-notification{animation-play-state:running}@keyframes aboutNotificationStack{0%,16.6667%{transform:translate3d(0,0,0) scale(1);opacity:1;filter:blur(0)}23.3333%,42%{transform:translate3d(0,var(--notification-step),0) scale(1);opacity:1;filter:blur(0)}48.6667%,67.3333%{transform:translate3d(0,calc(2 * var(--notification-step)),0) scale(1);opacity:1;filter:blur(0)}74%,91.6666%{transform:translate3d(0,calc(3 * var(--notification-step)),0) scale(.98);opacity:0;filter:blur(0)}91.6667%{transform:translate3d(8px,calc(-1 * var(--notification-step)),0) scale(.97);opacity:0;filter:blur(1.25px)}100%{transform:translate3d(0,0,0) scale(1);opacity:1;filter:blur(0)}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){:is(#about #bentoContactCard,#contact #contactBentoCard).notification-stack-card:hover .contact-notification{scale:1.025}:is(#about #bentoContactCard,#contact #contactBentoCard).notification-stack-card:hover .notification-stream::after{opacity:.22}}@container (max-width:420px){:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream{right:16px;width:calc(100% - 32px)}}@media (max-width:600px){:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro{left:20px;bottom:20px}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream{top:12px;right:14px;width:calc(100% - 28px)}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification{gap:9px;padding:8px 11px;border-radius:16px}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro h3{font-size:1.2rem}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-intro p{font-size:.81rem}}@media (prefers-reduced-motion:reduce){:is(#about #bentoContactCard,#contact #contactBentoCard).notification-stack-card{transition:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification,:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream::after{transition:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream{height:calc(100% - 82px);max-height:none;overflow-y:auto;scrollbar-width:thin}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-stream::after{display:none}:is(#about #bentoContactCard,#contact #contactBentoCard) .notification-list{display:flex;flex-direction:column;gap:var(--notification-gap);height:auto}:is(#about #bentoContactCard,#contact #contactBentoCard) .contact-notification{position:relative;inset:auto;flex-shrink:0;animation:none;filter:none;opacity:1!important;transform:none!important}}