:root{--bg:#0f0b1e;--card:hsla(0,0%,100%,.06);--stroke:hsla(0,0%,100%,.12);--accent:#ff5db1;--accent2:#7b5cff;--good:#34d399;--bad:#fb7185;--text:#f4f1ff;--muted:#a79fc9}*{box-sizing:border-box;margin:0;padding:0}body,html{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;min-height:100%}body{background:radial-gradient(1000px 600px at 15% -10%,rgba(123,92,255,.35),transparent 60%),radial-gradient(900px 600px at 100% 0,rgba(255,93,177,.28),transparent 55%),var(--bg);background-attachment:fixed}.wrap{max-width:1100px;margin:0 auto;padding:28px 20px 80px}.title{font-size:clamp(28px,5vw,46px);font-weight:800;letter-spacing:-.02em;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.subtitle{color:var(--muted);margin-top:6px;font-size:15px}.hud{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0;align-items:center}.chip{background:var(--card);border:1px solid var(--stroke);border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hearts{letter-spacing:3px;font-size:16px}.message{min-height:58px;margin:16px 0 4px;display:flex;align-items:center;border-radius:16px;padding:14px 18px;font-size:clamp(15px,2.4vw,18px);font-weight:600;border:1px solid var(--stroke);background:var(--card);transition:all .25s ease}.message.good{border-color:rgba(52,211,153,.5);background:rgba(52,211,153,.14);animation:msgIn .35s ease,goodPulse .6s ease}.message.bad{border-color:rgba(251,113,133,.5);background:rgba(251,113,133,.14);animation:msgIn .35s ease,badShake .45s ease}@keyframes msgIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes goodPulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}to{box-shadow:0 0 0 18px rgba(52,211,153,0)}}@keyframes badShake{0%,to{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(3px)}}.good-chip{border-color:rgba(52,211,153,.45);color:#6ee7b7}.bad-chip{border-color:rgba(251,113,133,.45);color:#fda4af}.section-label{text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--muted);margin:28px 0 12px}.timeline{display:flex;align-items:stretch;gap:0;overflow-x:auto;overflow-y:hidden;padding:10px 4px 22px;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:rgba(255,93,177,.55) transparent;-webkit-overflow-scrolling:touch}.timeline::-webkit-scrollbar{height:8px}.timeline::-webkit-scrollbar-track{background:hsla(0,0%,100%,.04);border-radius:999px}.timeline::-webkit-scrollbar-thumb{background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:999px}.timeline::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,var(--accent2),var(--accent))}.gap{flex:0 0 auto;width:52px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative}.gap:before{content:"";position:absolute;width:2px;height:100%;border-radius:3px;background:repeating-linear-gradient(180deg,var(--stroke) 0 8px,transparent 8px 16px);transition:all .15s ease}.gap:hover:before{background:var(--accent);box-shadow:0 0 16px var(--accent)}.gap:after{content:"＋";position:relative;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--card);border:1px solid var(--stroke);color:var(--muted);font-size:18px;line-height:1;transition:all .15s ease}.gap:hover:after{color:#fff;border-color:var(--accent);background:linear-gradient(90deg,var(--accent),var(--accent2));transform:scale(1.15);box-shadow:0 0 18px rgba(255,93,177,.6)}.tl-card{flex:0 0 auto;width:150px;border-radius:16px;overflow:hidden;background:var(--card);border:1px solid var(--stroke);display:flex;flex-direction:column;animation:pop .35s ease}@keyframes pop{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.tl-card img{width:100%;height:150px;object-fit:cover;display:block}.tl-card .meta{padding:10px 12px}.tl-card .date{font-size:12px;color:var(--muted)}.tl-card .age{font-size:15px;font-weight:700;margin-top:2px}.tl-card.birthday{border-color:var(--accent);box-shadow:0 0 24px rgba(255,93,177,.4)}.tl-card{position:relative}.tl-card.just{border-color:var(--good);animation:pop .35s ease,justGlow 1.4s ease;z-index:2}.tl-card.just:after{content:"✓";position:absolute;top:8px;right:8px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--good);color:#062a1e;font-weight:900;font-size:15px;animation:badgeIn .4s ease}@keyframes justGlow{0%{box-shadow:0 0 0 0 rgba(52,211,153,.7);transform:scale(1.06)}to{box-shadow:0 0 0 22px rgba(52,211,153,0);transform:scale(1)}}@keyframes badgeIn{0%{transform:scale(0) rotate(-40deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.current{margin-top:8px;display:flex;flex-direction:column;align-items:center;gap:14px}.current img{width:min(300px,62vw);height:min(300px,62vw);object-fit:cover;border-radius:24px;border:1px solid var(--stroke);box-shadow:0 30px 60px rgba(0,0,0,.45)}.current .hint{color:var(--muted);font-size:14px;text-align:center}.btn{border:none;border-radius:999px;padding:14px 28px;font-size:16px;font-weight:700;cursor:pointer;color:#fff;background:linear-gradient(90deg,var(--accent),var(--accent2));box-shadow:0 12px 30px rgba(123,92,255,.4)}.btn:hover{filter:brightness(1.08)}.end{text-align:center;padding:40px 20px;border-radius:24px;background:var(--card);border:1px solid var(--stroke)}.end h2{font-size:30px;margin-bottom:10px}.end p{color:var(--muted);margin-bottom:22px}.login-wrap{min-height:100dvh;justify-content:center}.login,.login-wrap{display:flex;align-items:center}.login{width:min(420px,100%);flex-direction:column;gap:14px;text-align:center;padding:36px 28px;border-radius:24px;background:var(--card);border:1px solid var(--stroke);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 30px 70px rgba(0,0,0,.45)}.login-emoji{font-size:40px}.login .subtitle{margin-top:0}.login-input{width:100%;padding:14px 18px;border-radius:999px;border:1px solid var(--stroke);background:hsla(0,0%,100%,.06);color:var(--text);font-size:16px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.login-input::placeholder{color:var(--muted)}.login-input:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(255,93,177,.2)}.login-input.err{border-color:var(--bad);box-shadow:0 0 0 4px rgba(251,113,133,.25)}.login-error{color:#fda4af;font-size:14px;font-weight:600;margin:-4px 0 0}.login .btn{width:100%}