body[data-special-day="birthday"] { --bg: #FFF1D4; --card: #FFFCF3; --border: #F0C885; --home: #9C4D27; --home-deep: #6E371D; --office: #FFC861; --office-text: #482B16; --muted: #83624F; background: radial-gradient(circle at 15px 15px,#F5BF7144 3px,transparent 4px) 0 0/44px 44px, #FFF1D4; }
body[data-special-day="anniversary"] { --bg: #FBE8ED; --card: #FFF8FA; --border: #E6ABBC; --home: #A33D60; --home-deep: #762C46; --office: #F1B5C7; --office-text: #532238; --muted: #8B5E70; background: radial-gradient(ellipse at top,#FFE3EC,#F8E9F0); }
body.role-office[data-special-day="birthday"] { --accent: #875020; }
body.role-office[data-special-day="anniversary"] { --accent: #8B3553; }
body[data-special-day] { isolation: isolate; }
body[data-special-day] #chat { background: transparent; }
body[data-special-day] header { background: linear-gradient(110deg,var(--office),var(--home)); }
#special-banner { flex-shrink: 0; margin: 10px 12px 0; padding: 14px 16px; border-radius: 22px 8px; border: 2px solid var(--border); background: var(--card); color: var(--ink); font-weight: 700; text-align: center; font-size: 15px; box-shadow: 0 4px 0 #00000008; }
#special-banner[hidden] { display: none; }
body[data-special-day] #daily-question { background: var(--card); border-color: var(--border); }
body[data-special-day] .bubble { border-radius: 23px 12px 23px 12px; box-shadow: 0 3px 0 #0000000B; }
body[data-special-day="anniversary"] .bubble { border-radius: 24px 24px 10px 24px; }
body[data-special-day] #input-bar { background: var(--card); border-top: 2px solid var(--border); }
body[data-special-day="birthday"] #text-input { border-radius: 20px 6px 20px 6px; border: 2px dashed #D99C4E; background: #FFFDF6; }
body[data-special-day="anniversary"] #text-input { border-radius: 28px 28px 10px 28px; border: 2px solid #C37A95; background: #FFFAFC; }
body[data-special-day] #toolbox-card, body[data-special-day] #calculator-card, body[data-special-day] #search-card, body[data-special-day] #wish-card, body[data-special-day] #status-card, body[data-special-day] #voucher-panel, body[data-special-day] #ime-panel { background: var(--card); border: 2px solid var(--border); }
#special-decor, #special-effects { position: fixed; inset: 0; pointer-events: none; overflow: hidden; }
#special-decor { z-index: -1; }
#special-decor span { position: absolute; font-size: 37px; opacity: .38; animation: special-bob 4s ease-in-out infinite alternate; }
#special-effects { z-index: 90; }
#special-effects span { position: absolute; top: 95%; animation: special-rise 2.8s ease-out both; }
@keyframes special-bob { to { transform: translateY(-15px) rotate(8deg); } }
@keyframes special-rise { 0% { opacity: 0; transform: translate(0,0) rotate(-10deg); } 12% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--drift),-90vh) rotate(35deg); } }
@media (prefers-reduced-motion: reduce) {
  #special-decor span { animation: none; }
  #special-effects span { top: 40%; animation: special-fade 2s ease both; }
  @keyframes special-fade { 0%,100% { opacity: 0; } 30%,70% { opacity: 1; } }
}