

/* Whitehat protocol additions. Existing site styles remain unchanged. */
.my-news-home, .my-news-page { --my-news-surface: rgba(255, 255, 255, 0.9); --my-news-text: #2d3436; --my-news-muted: #636e72; --my-news-accent: #ff6b9d; --my-news-line: rgba(255, 107, 157, 0.25); }
.my-news-home { width: 100%; padding: 26px 16px 42px; color: var(--my-news-text); }
.my-news-home .my-news-shell, .my-news-page .my-news-shell { width: min(1180px, calc(100% - 0px)); margin: 0 auto; }
.my-news-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--my-news-line); }
.my-news-kicker { margin: 0 0 3px; color: var(--my-news-accent); font-size: .78rem; font-weight: 800; letter-spacing: .13em; }
.my-news-heading h2, .my-news-page h1, .my-news-page h2, .my-news-card h2, .my-news-card h3 { color: var(--my-news-text); }
.my-news-heading h2 { margin: 0; font-size: clamp(1.45rem, 2.8vw, 2rem); line-height: 1.25; }
.my-news-all-link, .my-news-card a, .my-news-back { display: inline-flex; align-items: center; width: fit-content; color: var(--my-news-text); font-weight: 700; text-decoration: none; border-bottom: 1px solid var(--my-news-accent); }
.my-news-all-link:hover, .my-news-card a:hover, .my-news-back:hover { color: var(--my-news-accent); }
.my-news-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.my-news-card { display: flex; flex-direction: column; min-width: 0; min-height: 196px; padding: 20px; color: var(--my-news-text); background: var(--my-news-surface); border: 1px solid var(--my-news-line); border-radius: 8px; box-shadow: 0 14px 36px rgba(0,0,0,.12); }
.my-news-card h2, .my-news-card h3 { margin: 0; font-size: 1.08rem; line-height: 1.5; }
.my-news-card time { display: block; margin: 10px 0 0; color: var(--my-news-muted); font-size: .86rem; }
.my-news-card p { margin: 10px 0 16px; color: var(--my-news-muted); }
.my-news-card a { margin-top: auto; }
.my-news-empty { grid-column: 1 / -1; margin: 0; padding: 20px; color: var(--my-news-muted); background: var(--my-news-surface); border: 1px dashed var(--my-news-line); border-radius: 8px; }
.my-news-page { min-height: 100vh; padding: 44px 16px 64px; color: var(--my-news-text); }
.my-news-page .my-news-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; color: var(--my-news-muted); }
.my-news-page .my-news-brand { margin: 0; color: var(--my-news-muted); font-size: .93rem; }
.my-news-page .my-news-intro { max-width: 760px; margin: 0 0 24px; color: var(--my-news-muted); }
.my-news-page .my-news-detail { max-width: 820px; padding: clamp(22px, 5vw, 44px); color: var(--my-news-text); background: var(--my-news-surface); border: 1px solid var(--my-news-line); border-radius: 8px; box-shadow: 0 14px 36px rgba(0,0,0,.12); }
.my-news-page .my-news-detail h1 { margin: 0; font-size: clamp(1.8rem, 5vw, 3rem); line-height: 1.22; }
.my-news-page .my-news-detail time { display: block; margin: 16px 0 24px; color: var(--my-news-muted); }
.my-news-summary { margin: 0 0 20px; color: var(--my-news-muted); font-size: 1.05rem; }
.my-news-content { margin: 0; color: var(--my-news-text); white-space: pre-wrap; }
.my-news-page .my-news-footer { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.my-friend-link {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 92px;
  padding: 1.5rem 1.5rem 1.5rem 5.25rem;
  overflow: hidden;
  color: var(--text-happiness-primary, #2d3436);
  background: var(--bg-happiness-card, rgba(255, 255, 255, 0.9));
  border: 2px solid transparent;
  border-radius: var(--radius-happiness-md, 16px);
  box-shadow: var(--shadow-happiness-sm, 0 2px 8px rgba(255, 107, 157, 0.15));
  font-family: var(--font-happiness-primary, inherit);
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  transition: transform var(--transition-happiness-normal, 240ms ease), box-shadow var(--transition-happiness-normal, 240ms ease), border-color var(--transition-happiness-normal, 240ms ease);
}
.my-friend-link::before {
  content: '🎮';
  position: absolute;
  left: 1.5rem;
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--happiness-primary, #ff6b9d), var(--happiness-accent, #ff9ff3));
  box-shadow: var(--shadow-happiness-sm, 0 2px 8px rgba(255, 107, 157, 0.15));
  font-size: 1.35rem;
}
.my-friend-link::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 107, 157, 0.1), transparent);
  transition: left var(--transition-happiness-normal, 240ms ease);
}
.my-friend-link:hover,
.my-friend-link:focus-visible {
  color: var(--happiness-primary, #ff6b9d);
  border-color: var(--happiness-primary, #ff6b9d);
  box-shadow: var(--shadow-happiness-lg, 0 8px 32px rgba(255, 107, 157, 0.25));
  outline: none;
  transform: translateY(-5px);
}
.my-friend-link:hover::after,
.my-friend-link:focus-visible::after { left: 100%; }
.friends-links-grid-happiness-8w4k2 > .my-friend-link { min-width: 0; }
@media (max-width: 768px) {
  .my-friend-link { min-height: 82px; padding: 1.15rem 1.15rem 1.15rem 4.75rem; }
  .my-friend-link::before { left: 1.15rem; width: 2.75rem; height: 2.75rem; }
}
.download-confirm-backdrop { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 18px; background: rgba(0,0,0,.64); }
.download-confirm-panel { width: min(460px, 100%); padding: 24px; color: var(--my-news-text); background: var(--my-news-surface); border: 1px solid var(--my-news-line); border-radius: 8px; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.download-confirm-panel h2 { margin: 0 0 10px; color: var(--my-news-text); font-size: 1.3rem; }
.download-confirm-panel p { margin: 0; color: var(--my-news-muted); }
.download-confirm-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.download-confirm-actions button { min-height: 40px; padding: 0 16px; font: inherit; font-weight: 700; color: var(--my-news-text); background: transparent; border: 1px solid var(--my-news-line); border-radius: 6px; cursor: pointer; }
.download-confirm-actions .download-confirm-primary { color: #1b140c; background: var(--my-news-accent); border-color: var(--my-news-accent); }
@media (max-width: 640px) { .my-news-home { padding-inline: 12px; } .my-news-heading, .my-news-page .my-news-topbar { align-items: flex-start; flex-direction: column; } .my-news-page { padding: 26px 12px 44px; } .my-news-card { min-height: 0; } }
