.home-feel { position: relative; }
.home-status { flex: none; margin-top: 14px; text-align: center; }
.home-time { display: block; color: #75664f; font: 11px/1.5 ui-monospace, "Courier New", monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
.home-feeling { display: block; min-height: 44px; max-width: 100%; margin: 0 auto; padding: 4px 10px; border: 0; background: none; color: var(--rose); font: 12px/1.5 var(--font-body, "DM Sans"), sans-serif; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.home-feeling:active { color: #743a47; }
@media (max-height: 650px) { .home-status { margin-top: 8px; } .home-feel .gallery { --cat-size: 116px; } .home-feel .rayan-cat { width: 52px; } .home-feel .name-heart { line-height: 1.5; } }
@media (max-height: 350px) and (min-width: 480px) { .home-feel .home-status { grid-column: 1; grid-row: 2; margin-top: 4px; } .home-feel .heart-scene { grid-column: 1; grid-row: 3; } .home-feel .gallery { grid-column: 2; grid-row: 2 / 4; } }
.home-controls { position: absolute; top: max(20px, env(safe-area-inset-top)); left: 16px; right: 16px; display: flex; justify-content: space-between; pointer-events: none; }
.home-control { pointer-events: auto; width: 44px; height: 44px; display: grid; place-items: center; border: 0; padding: 0; border-radius: 50%; color: var(--rose); background: transparent; font: 23px Georgia, serif; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.home-control[aria-pressed="true"] { background: #985c6610; }
.home-control:active { background: #985c6625; }
.home-feel .gallery-dot { width: 44px; height: 44px; touch-action: manipulation; }
.home-feel .cat { touch-action: pan-y; }
.home-feel[data-motion="on"] .cat img { animation: hello-cat 1.6s ease-in-out 1; transform-origin: 50% 85%; }
.home-feel[data-motion="on"][data-music="true"] .cat img { animation: sleepy-sway 6s ease-in-out infinite; }
.home-feel[data-motion="on"][data-music="true"] .rayan-cat { animation: tiny-float 6s ease-in-out infinite; }
.home-feel[data-motion="on"][data-music="true"] .rayan-lasagna { animation-delay: -3s; }
.home-feel[data-motion="on"] .name-heart:active { color: #743a47; }
.touch-heart { position: absolute; pointer-events: none; z-index: 5; color: var(--rose); font: 20px Georgia, serif; animation: touch-love 1.1s ease-out both; }
.home-feel[data-motion="off"] .little-heart { display: none; }
@keyframes hello-cat { 0%, 100% { transform: rotate(0); } 30% { transform: rotate(-4deg); } 65% { transform: rotate(3deg); } }
@keyframes sleepy-sway { 0%, 100% { transform: rotate(-2deg) translateY(0); } 50% { transform: rotate(2deg) translateY(-3px); } }
@keyframes tiny-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes touch-love { from { opacity: .9; transform: translate(-50%, -50%) scale(.7); } to { opacity: 0; transform: translate(calc(-50% + var(--drift)), -65px) scale(1.15); } }
@media (max-height: 500px) { .home-controls { top: max(4px, env(safe-area-inset-top)); } .home-feel .gallery-dot { height: 36px; } }
@media (prefers-reduced-motion: reduce) { .home-feel .cat img, .home-feel .rayan-cat, .touch-heart { animation: none !important; } .touch-heart { display: none; } }