body { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; background-color: #eef1f5; overflow-y: scroll; }
.grid-diary { background-color: #fafaf9; background-image: linear-gradient(to right, rgba(0, 0, 0, 0.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 1px, transparent 1px); background-size: 24px 24px; background-position: top left; }
.diary-content { line-height: 24px; font-size: 15px; color: #333; }
.os-glass { background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255, 255, 255, 0.5); z-index: 50;}
.smooth-wrapper { max-height: 0; opacity: 0; overflow: hidden; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
.smooth-wrapper.open { max-height: 2000px; opacity: 1; margin-top: 1rem; }
.smooth-info { max-height: 0; opacity: 0; overflow: hidden; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
.smooth-info.open { max-height: 300px; opacity: 1; margin-top: 0.75rem; }
.btn-press { transition: transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); }
.btn-press:active { transform: scale(0.95); }
.mac-dots span { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 6px; }
.mac-close { background-color: #ff5f56; } .mac-min { background-color: #ffbd2e; } .mac-max { background-color: #27c93f; }
.toast { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.9); background: rgba(0, 0, 0, 0.75); backdrop-filter: blur(10px); color: white; padding: 12px 24px; border-radius: 14px; font-weight: 500; z-index: 9999; opacity: 0; pointer-events: none; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.toast.show { opacity: 1; transform: translate(-50%, -50%) scale(1); }

@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
.fade-in-up { opacity: 0; animation: fadeInUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.neighbor-card { transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); transform-origin: center center; }
.neighbor-card:hover { transform: translateY(-4px); box-shadow: 0 12px 24px -8px rgba(79, 70, 229, 0.15); }
.neighbor-card:active { transform: scale(0.96); box-shadow: 0 4px 8px -4px rgba(79, 70, 229, 0.1); }
.shine-layer { position: absolute; top: 0; left: -100%; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); transform: skewX(-25deg); z-index: 10; pointer-events: none; }
@keyframes sweep { 0% { left: -100%; } 100% { left: 200%; } }
.neighbor-card:hover .shine-layer { animation: sweep 0.7s ease-in-out; }