.sug-modal { display: flex; flex-direction: column; gap: var(--sp-3); }
.sug-intro { font-size: var(--fs-sm); color: var(--text-secondary); line-height: 1.5; margin: 0; }
.sug-textarea {
    width: 100%; min-height: 120px; resize: vertical;
    background: var(--bg-input); border: 1px solid var(--border);
    border-radius: var(--r-md); color: var(--text-primary);
    font-family: var(--font-body); font-size: var(--fs-base);
    padding: var(--sp-3); transition: border-color var(--tr-fast);
}
.sug-textarea:focus { outline: none; border-color: var(--border-focus); }
.sug-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.sug-count { font-size: var(--fs-xs); color: var(--text-muted); }
.sug-send-btn {
    display: flex; align-items: center; gap: 8px; border: none; cursor: pointer;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff; font-weight: var(--fw-semibold); font-size: var(--fs-sm);
    padding: 9px 18px; border-radius: var(--r-full);
    box-shadow: var(--shadow-sm); transition: transform var(--tr-fast), box-shadow var(--tr-fast);
}
.sug-send-btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-accent); }
.sug-send-btn:disabled { opacity: 0.6; cursor: default; transform: none; }
.bday-modal { display: flex; flex-direction: column; gap: var(--sp-3); }
.bday-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.bday-nav-btn {
    width: 34px; height: 34px; flex-shrink: 0; border: 1px solid var(--border);
    background: var(--bg-raised); color: var(--text-secondary); border-radius: var(--r-full);
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    transition: color var(--tr-fast), background var(--tr-fast), border-color var(--tr-fast), transform var(--tr-fast);
}
.bday-nav-btn:hover { color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-2)); border-color: transparent; transform: scale(1.06); }
.bday-nav-label { display: flex; flex-direction: column; align-items: center; line-height: 1.15; }
.bday-month-name { font-family: var(--font-display); font-size: var(--fs-lg); font-weight: var(--fw-bold); color: var(--text-primary); }
.bday-year-name { font-size: var(--fs-xs); color: var(--text-muted); letter-spacing: 0.08em; }
.bday-sub { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.bday-today-btn {
    display: flex; align-items: center; gap: 6px; border: 1px solid var(--border);
    background: var(--bg-raised); color: var(--text-secondary); font-size: var(--fs-xs);
    font-weight: var(--fw-semibold); padding: 6px 12px; border-radius: var(--r-full); cursor: pointer;
    transition: color var(--tr-fast), border-color var(--tr-fast);
}
.bday-today-btn:hover { color: var(--accent); border-color: var(--border-focus); }
.bday-total { font-size: var(--fs-xs); color: var(--text-muted); font-weight: var(--fw-medium); }
.bday-weekdays {
    display: grid; grid-template-columns: repeat(7, 1fr); text-align: center;
    font-size: var(--fs-xs); font-weight: var(--fw-bold); color: var(--text-muted);
    letter-spacing: 0.04em; padding-bottom: 2px;
}
.bday-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.bday-cell {
    position: relative; aspect-ratio: 1 / 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; border-radius: var(--r-md);
    background: var(--bg-raised); border: 1px solid transparent; cursor: default;
    transition: transform var(--tr-fast), background var(--tr-fast), border-color var(--tr-fast);
}
.bday-num { font-size: var(--fs-sm); color: var(--text-secondary); font-weight: var(--fw-medium); }
.bday-cell--out { background: transparent; }
.bday-cell--out .bday-num { color: var(--text-muted); opacity: 0.4; }
.bday-cell--today { border-color: var(--border-focus); }
.bday-cell--today .bday-num { color: var(--accent); font-weight: var(--fw-bold); }
.bday-cell--bday {
    cursor: pointer;
    background: linear-gradient(160deg, var(--bg-raised), var(--bg-active));
    box-shadow: 0 0 0 1px var(--accent-glow) inset;
    animation: bdayGlow 2.4s ease-in-out infinite;
}
.bday-cell--bday .bday-num { color: var(--text-primary); font-weight: var(--fw-bold); }
.bday-cell--bday:hover { transform: translateY(-2px) scale(1.05); }
.bday-cell--bday.bday-cell--active {
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    box-shadow: var(--shadow-accent);
}
.bday-cell--bday.bday-cell--active .bday-num,
.bday-cell--bday.bday-cell--active .bday-dot { color: #fff; }
@keyframes bdayGlow {
    0%, 100% { box-shadow: 0 0 0 1px var(--accent-glow) inset, 0 0 6px 0 var(--accent-glow); }
    50% { box-shadow: 0 0 0 1px var(--accent-glow) inset, 0 0 14px 2px var(--accent-glow); }
}
.bday-dot {
    font-size: 12px; line-height: 1; margin-top: 1px; display: flex;
    align-items: center; gap: 2px; color: var(--accent);
}
.bday-dot b { font-size: 9px; font-weight: var(--fw-black); color: var(--text-primary); }
.bday-loading { grid-column: 1 / -1; text-align: center; padding: var(--sp-5) 0; color: var(--text-muted); font-size: var(--fs-sm); }
.bday-daylist {
    border-top: 1px solid var(--border); padding-top: var(--sp-3);
    display: flex; flex-direction: column; gap: 6px; animation: ctxFadeIn 0.15s ease;
}
.bday-daylist-title { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--text-primary); margin-bottom: 2px; }
.bday-daylist-item {
    display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm);
    color: var(--text-secondary); background: var(--bg-raised); border-radius: var(--r-sm);
    padding: 7px 10px;
}
.bday-daylist-item i { color: var(--accent); }
@media (max-width: 400px) {
    .bday-num { font-size: var(--fs-xs); }
    .bday-dot { font-size: 10px; }
    .bday-month-name { font-size: var(--fs-md); }
}
.com-wall { display: flex; flex-direction: column; gap: var(--sp-5); max-width: 640px; margin: 0 auto; width: 100%; }
.com-form {
    display: flex; flex-direction: column; gap: var(--sp-3);
    background: var(--bg-raised); border: 1px solid var(--border);
    border-radius: var(--r-lg); padding: var(--sp-4);
}
.com-input, .com-textarea {
    width: 100%; background: var(--bg-input); border: 1px solid var(--border);
    border-radius: var(--r-md); color: var(--text-primary);
    font-family: var(--font-body); font-size: var(--fs-base);
    padding: var(--sp-3); transition: border-color var(--tr-fast);
}
.com-input:focus, .com-textarea:focus { outline: none; border-color: var(--border-focus); }
.com-textarea { min-height: 100px; resize: vertical; }
.com-form-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.com-count { font-size: var(--fs-xs); color: var(--text-muted); }
.com-send-btn {
    display: flex; align-items: center; gap: 8px; border: none; cursor: pointer;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff; font-weight: var(--fw-semibold); font-size: var(--fs-sm);
    padding: 9px 18px; border-radius: var(--r-full);
    box-shadow: var(--shadow-sm); transition: transform var(--tr-fast), box-shadow var(--tr-fast);
}
.com-send-btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-accent); }
.com-send-btn:disabled { opacity: 0.6; cursor: default; transform: none; }
.com-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.com-card {
    display: flex; gap: var(--sp-3); align-items: flex-start;
    background: var(--bg-raised); border: 1px solid var(--border);
    border-radius: var(--r-lg); padding: var(--sp-3) var(--sp-4);
    animation: modalIn 0.25s ease;
}
.com-avatar {
    flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #fff; font-family: var(--font-display); font-weight: var(--fw-bold);
    font-size: var(--fs-md);
}
.com-body { flex: 1; min-width: 0; }
.com-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 3px; }
.com-nick { font-weight: var(--fw-bold); color: var(--text-primary); font-size: var(--fs-sm); }
.com-date { font-size: var(--fs-xs); color: var(--text-muted); }
.com-text { font-size: var(--fs-sm); color: var(--text-secondary); line-height: 1.5; overflow-wrap: anywhere; }
.com-empty, .com-loading {
    text-align: center; color: var(--text-muted); font-size: var(--fs-sm);
    padding: var(--sp-5) 0;
}