Session 11: Golden Starbloom random event (clickable bonus + production boost)

css/game.css

@@ -952,3 +952,75 @@ h2, h3 {
     border-color: var(--accent-purple);
     background: linear-gradient(135deg, var(--bg-card) 0%, #2a1a3e 100%);
 }
+
+/* ============================================
+   Golden Starbloom Random Event
+   ============================================ */
+
+/* Countdown badge in the header */
+.golden-bloom-badge {
+    font-size: 0.95rem;
+    font-weight: bold;
+    color: var(--text-secondary);
+    padding: 4px 12px;
+    border-radius: 20px;
+    border: 1px solid transparent;
+    white-space: nowrap;
+    opacity: 0;
+    transform: translateY(-6px);
+    transition: opacity 0.3s ease, transform 0.3s ease;
+}
+
+.golden-bloom-badge.active {
+    opacity: 1;
+    transform: translateY(0);
+    color: var(--accent-gold);
+    background: rgba(255, 215, 0, 0.12);
+    border-color: var(--accent-gold);
+    box-shadow: 0 0 12px rgba(255, 215, 0, 0.35);
+}
+
+/* The floating bloom itself */
+#golden-bloom-container {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+}
+
+.golden-bloom {
+    position: absolute;
+    font-size: 3rem;
+    cursor: pointer;
+    line-height: 1;
+    filter: drop-shadow(0 0 14px rgba(255, 215, 0, 0.9));
+    animation: goldenBloomFloat 2s ease-in-out infinite, goldenBloomPulse 1.4s ease-in-out infinite;
+    transition: transform 0.1s ease;
+    pointer-events: auto;
+}
+
+.golden-bloom:hover {
+    transform: scale(1.15);
+    filter: drop-shadow(0 0 22px rgba(255, 215, 0, 1));
+}
+
+@keyframes goldenBloomFloat {
+    0%, 100% { translateY(0); }
+    50% { translateY(-8px); }
+}
+
+@keyframes goldenBloomPulse {
+    0%, 100% { opacity: 0.85; }
+    50% { opacity: 1; }
+}
+
+/* Golden particle effect styles */
+.particle.golden-bloom-particle {
+    background: radial-gradient(circle, #fff2a8 0%, #ffd700 60%, transparent 100%);
+}
+
+.particle.golden-sparkle {
+    background: radial-gradient(circle, #ffffff 0%, #ffe469 100%);
+}