:root{--ink: #fdf3f6;--ink-soft: #e6c7d5;--ink-faint: #a8879a;--rose: #ff7eb3;--rose-deep: #e0578f;--blush: #ffc2d8;--gold: #ffd6a5;--lilac: #c8a2ff;--bg-0: #14080f;--bg-1: #1f0c1a;--bg-2: #2b1024;--card: rgba(255, 255, 255, .055);--card-line: rgba(255, 190, 216, .16);--serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Georgia", serif;--sans: ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg-0);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}body:before{content:"";position:fixed;top:-30vmax;right:-30vmax;bottom:-30vmax;left:-30vmax;z-index:-2;background:radial-gradient(38vmax 38vmax at 18% 12%,rgba(255,126,179,.22),transparent 65%),radial-gradient(34vmax 34vmax at 82% 28%,rgba(200,162,255,.2),transparent 65%),radial-gradient(40vmax 40vmax at 50% 88%,rgba(255,214,165,.14),transparent 65%),linear-gradient(170deg,var(--bg-1),var(--bg-0) 55%,var(--bg-2));animation:drift 34s ease-in-out infinite alternate}@keyframes drift{0%{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(2%,3%,0) scale(1.08)}}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}.section{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;padding:5rem 1.5rem;text-align:center;position:relative}.reveal{opacity:0;transform:translateY(28px);filter:blur(6px);transition:opacity 1s cubic-bezier(.2,.7,.3,1),transform 1s cubic-bezier(.2,.7,.3,1),filter 1s ease}.reveal.shown{opacity:1;transform:none;filter:none}.reveal-1{transition-delay:.12s}.reveal-2{transition-delay:.26s}.reveal-3{transition-delay:.4s}.reveal-4{transition-delay:.54s}.eyebrow{font-size:clamp(.68rem,2vw,.78rem);letter-spacing:.42em;text-transform:uppercase;color:var(--rose);margin:0;font-weight:600}.headline{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,6.2vw,3.4rem);line-height:1.18;margin:0;max-width:20ch;text-wrap:balance}.sub{color:var(--ink-soft);font-size:clamp(.95rem,2.6vw,1.1rem);line-height:1.65;margin:0;max-width:44ch;text-wrap:pretty}.tiny{color:var(--ink-faint);font-size:.82rem;margin:0}.stat{font-family:var(--serif);font-size:clamp(4rem,20vw,10.5rem);line-height:.92;margin:0;background:linear-gradient(165deg,#fff 8%,var(--blush) 45%,var(--rose) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 34px rgba(255,126,179,.34))}.stat-unit{font-family:var(--sans);font-size:clamp(.85rem,3vw,1.05rem);letter-spacing:.34em;text-transform:uppercase;color:var(--ink-faint);margin:0}.card{background:var(--card);border:1px solid var(--card-line);border-radius:22px;padding:1.4rem 1.5rem;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 18px 48px #0000004d}.grid{display:grid;gap:.85rem;width:min(100%,640px);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.heatmap-card{width:min(100%,940px);padding:1.4rem 1.3rem 1.1rem;display:grid;gap:1.5rem}.heatmap-year{display:grid;gap:.45rem}.year-label{font-family:var(--serif);font-size:1.05rem;color:var(--blush);letter-spacing:.06em;text-align:left;padding-left:2px}.heatmap-scroll{overflow-x:auto;overflow-y:hidden;padding-bottom:.3rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,126,179,.45) transparent}.heatmap-scroll::-webkit-scrollbar{height:7px}.heatmap-scroll::-webkit-scrollbar-track{background:transparent}.heatmap-scroll::-webkit-scrollbar-thumb{background:#ff7eb361;border-radius:99px}.heatmap-scroll::-webkit-scrollbar-thumb:hover{background:#ff7eb399}.heatmap-inner{display:inline-grid;min-width:max-content}.heatmap-body{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:5px;row-gap:.3rem}.weekdays{display:grid;grid-template-rows:repeat(7,13px);gap:3px;font-size:.58rem;color:var(--ink-faint);align-items:center;text-align:right;padding-right:2px}.heatmap-months{display:grid;grid-auto-flow:column;grid-auto-columns:13px;gap:3px;font-size:.6rem;color:var(--ink-faint);letter-spacing:.03em}.heatmap-months>span{overflow:visible;white-space:nowrap}.heatmap-grid{display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,13px);grid-auto-columns:13px;gap:3px}.cell{width:13px;height:13px;border-radius:3.5px;background:#ffffff0b;transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1),filter .15s ease}.shown .cell{transform:scale(1)}.cell.out{background:transparent}.cell.l1{background:#6d2846}.cell.l2{background:#a8395f}.cell.l3{background:#e05a8c}.cell.l4{background:#ff8fc0;box-shadow:0 0 10px #ff8fc0bf}.cell:hover{filter:brightness(1.45)}.legend{display:flex;align-items:center;justify-content:center;gap:.4rem;color:var(--ink-faint);font-size:.72rem}.legend .cell{transform:scale(1);width:11px;height:11px}.emoji-hero{font-size:clamp(4.5rem,22vw,9rem);line-height:1;animation:pulse 2.6s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.12) rotate(3deg)}}.emoji-row{display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem}.emoji-chip{display:flex;flex-direction:column;align-items:center;gap:.2rem;background:var(--card);border:1px solid var(--card-line);border-radius:16px;padding:.6rem .85rem;min-width:62px}.emoji-chip .e{font-size:1.7rem;line-height:1}.emoji-chip .n{font-size:.72rem;color:var(--ink-faint)}.bubbles{display:flex;flex-direction:column;gap:.6rem;width:min(100%,460px)}.bubble{padding:.72rem 1.05rem;border-radius:20px;font-size:.95rem;line-height:1.45;max-width:84%;text-align:left;word-break:break-word}.bubble.them{align-self:flex-start;background:#ffffff17;border-bottom-left-radius:6px}.bubble.me{align-self:flex-end;background:linear-gradient(135deg,var(--rose-deep),var(--rose));color:#fff;border-bottom-right-radius:6px}.bubble-meta{font-size:.7rem;color:var(--ink-faint);align-self:center;margin-top:.2rem}.versus{width:min(100%,460px);display:flex;height:46px;border-radius:999px;overflow:hidden;border:1px solid var(--card-line)}.versus>div{display:flex;align-items:center;justify-content:center;font-size:.82rem;font-weight:600;transition:flex-grow 1.3s cubic-bezier(.2,.7,.3,1);overflow:hidden;white-space:nowrap}.versus .v-me{background:linear-gradient(135deg,var(--rose-deep),var(--rose));color:#fff}.versus .v-them{background:linear-gradient(135deg,var(--lilac),#9d7bd8);color:#fff}.versus-key{display:flex;gap:1.4rem;justify-content:center;font-size:.8rem;color:var(--ink-soft)}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:.4rem}.dot.me{background:var(--rose)}.dot.them{background:var(--lilac)}.record{display:flex;align-items:center;gap:.95rem;text-align:left;padding:.95rem 1.1rem}.record .ico{font-size:1.6rem;line-height:1}.record .label{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-faint)}.record .value{font-size:1.1rem;font-family:var(--serif)}.hearts{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;overflow:hidden}.heart{position:absolute;bottom:-8vh;font-size:1.05rem;opacity:0;animation:float-up linear infinite}@keyframes float-up{0%{opacity:0;transform:translateY(0) scale(.7) rotate(0)}12%{opacity:.55}88%{opacity:.3}to{opacity:0;transform:translateY(-115vh) scale(1.1) rotate(24deg)}}.cue{position:absolute;bottom:2.2rem;color:var(--ink-faint);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;animation:bob 2.2s ease-in-out infinite}@keyframes bob{0%,to{transform:translateY(0);opacity:.5}50%{transform:translateY(7px);opacity:1}}.center-note{display:grid;place-items:center;min-height:100svh;padding:2rem;text-align:center;gap:.8rem}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none;filter:none}.cell{transform:scale(1)}}.login{min-height:100svh;display:grid;place-items:center;padding:1.5rem;position:relative;z-index:1;transition:opacity .8s ease,transform .8s ease,filter .8s ease}.login.opening{opacity:0;transform:scale(1.04);filter:blur(8px);transition-delay:.25s}.login-card{width:min(100%,420px);display:grid;justify-items:center;gap:.9rem;padding:2.4rem 1.8rem 1.6rem;text-align:center;animation:rise 1s cubic-bezier(.2,.7,.3,1) both}@keyframes rise{0%{opacity:0;transform:translateY(24px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}.envelope{font-size:3.6rem;line-height:1;animation:pulse 2.6s ease-in-out infinite}.opening .envelope{animation:pop .7s cubic-bezier(.34,1.56,.64,1) both}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.35) rotate(-8deg)}to{transform:scale(1.15) rotate(0)}}.login-title{font-size:clamp(1.6rem,6vw,2.2rem)}.login-field{display:flex;gap:.5rem;width:100%;margin-top:.4rem}.login-field input{flex:1;min-width:0;font:inherit;font-size:1rem;color:var(--ink);background:#ffffff0f;border:1px solid var(--card-line);border-radius:999px;padding:.8rem 1.1rem;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.login-field input::placeholder{color:var(--ink-faint)}.login-field input:focus{border-color:var(--rose);box-shadow:0 0 0 4px #ff7eb32e}.login-field button{font:inherit;font-weight:600;font-size:.95rem;color:#fff;background:linear-gradient(135deg,var(--rose-deep),var(--rose));border:0;border-radius:999px;padding:.8rem 1.2rem;cursor:pointer;white-space:nowrap;box-shadow:0 8px 24px #e0578f59;transition:transform .15s ease,opacity .2s ease,box-shadow .2s ease}.login-field button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 28px #e0578f80}.login-field button:disabled{opacity:.45;cursor:default;box-shadow:none}.login-field button:focus-visible{outline:2px solid var(--blush);outline-offset:3px}.login-field.shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-7px)}40%,60%{transform:translate(7px)}}.login-error{color:var(--blush);font-size:.85rem;margin:0;min-height:1.2em}
