/* Tailwind 无法覆盖时，在此补充自定义样式 */

/* 复盘区：Markdown 渲染后的 prose 样式（Tailwind 默认重置了所有标签样式） */
.review-content h1,
.review-content h2,
.review-content h3 {
    font-weight: 600;
    margin-top: 1rem;
    margin-bottom: 0.25rem;
    color: #374151;
}
.review-content h1 { font-size: 1.05rem; }
.review-content h2 { font-size: 0.95rem; }
.review-content h3 { font-size: 0.875rem; }
.review-content p { margin-bottom: 0.5rem; }
.review-content ul,
.review-content ol {
    margin-left: 1.25rem;
    margin-bottom: 0.5rem;
}
.review-content ul { list-style-type: disc; }
.review-content ol { list-style-type: decimal; }
.review-content li { margin-bottom: 0.2rem; }
.review-content strong { font-weight: 600; color: #1f2937; }
.review-content hr { border-color: #e5e7eb; margin: 0.75rem 0; }

/* 项目标签 chip：选中时用标签自己的颜色（颜色来自数据，Tailwind 做不到） */
.tag-chip { border-color: #e5e7eb; color: #374151; }
input:checked + .tag-chip { background-color: var(--c); border-color: var(--c); color: #fff; }
input:checked + .tag-chip > span { background-color: #fff !important; }

/* 类型标签 chip（方角、类型色描边，选中实心），与项目的圆角 chip 区分；没选类型时才显示提示 */
.type-chip { border-color: var(--c); color: var(--c); background-color: #fff; }
input:checked + .type-chip { background-color: var(--c); color: #fff; }
.type-hint { display: none; }
#type-picker:has(input[value="none"]:checked) .type-hint { display: block; }

/* 任务拖拽排序（SortableJS 的 class 只能是单个类名，Tailwind 组合类用不上） */
/* 落点：虚线占位框 */
.drag-ghost { background: #eef2ff !important; border: 2px dashed #a5b4fc !important; box-shadow: none !important; }
.drag-ghost > * { visibility: hidden; }
/* 跟手的浮动卡片：不透明、带阴影，盖住下面的内容（Sortable 默认给它 0.8 透明度，会透出底下的文字） */
.drag-fallback { opacity: 1 !important; box-shadow: 0 12px 28px rgba(79, 70, 229, 0.25) !important; }
/* 手机上长按拖动：禁止长按选中文字 / 弹出系统菜单 */
@media (pointer: coarse) {
    .touch-sortable > * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
}

/* ── 每日任务系统：得分表现（关键帧 / 过渡，Tailwind CDN 做不到；JS 在 base.html）── */
/* 飘字：+12 创业，上浮约 60px、1 秒淡出 */
.score-float {
    position: fixed; z-index: 70; pointer-events: none; white-space: nowrap;
    font-size: 15px; font-weight: 700; opacity: 0;
    padding: 1px 10px; border-radius: 9999px; background: rgba(255, 255, 255, .94);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .12);
    transform: translate(-50%, -100%);
    animation: score-float 1s ease-out forwards;
}
@keyframes score-float {
    0%   { opacity: 0; transform: translate(-50%, -100%); }
    12%  { opacity: 1; }
    70%  { opacity: 1; }
    100% { opacity: 0; transform: translate(-50%, calc(-100% - 60px)); }
}
/* 能量环 / 积分条：数值变化时能量往前"流"（600ms） */
.ring-seg { transition: stroke-dasharray 600ms ease-out, stroke-dashoffset 600ms ease-out; }
.ring-tip { transform-origin: 160px 160px; transition: transform 600ms ease-out; }
.chip-layer { transition: width 600ms ease-out; }
/* 等级光晕：轻微、缓慢地呼吸（幅度和频率都小，免得晃眼） */
.ring-halo { animation: ring-halo 5s ease-in-out infinite; }
@keyframes ring-halo { 0%, 100% { opacity: .85; } 50% { opacity: 1; } }
/* 环中间的文字：白色描边，铺了底色 / 底纹也看得清 */
.ring-text { text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 6px rgba(255, 255, 255, .9); }
/* 徽章点亮：放大 + 光晕一次 */
.badge-pop { transform-box: fill-box; transform-origin: center; animation: badge-pop 900ms ease-out; }

@keyframes badge-pop {
    0%   { transform: scale(.6); filter: drop-shadow(0 0 0 currentColor); }
    45%  { transform: scale(1.3); filter: drop-shadow(0 0 8px currentColor); }
    100% { transform: scale(1); filter: drop-shadow(0 0 0 currentColor); }
}
/* 徽章解锁：遮罩 + 卡片，徽章弹出、背后光芒旋转（--c = 等级色） */
.badge-unlock {
    position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .45); cursor: pointer; animation: unlock-fade 3.6s ease-out forwards;
}
.badge-unlock-card {
    position: relative; overflow: hidden; width: min(320px, calc(100% - 2rem)); padding: 28px 24px 20px;
    border-radius: 24px; background: #fff; text-align: center;
    box-shadow: 0 0 0 3px var(--c), 0 0 48px var(--c), 0 24px 60px rgba(15, 23, 42, .3);
    animation: unlock-card 600ms cubic-bezier(.2, 1.4, .4, 1) both;
}
.badge-unlock-rays {
    position: absolute; left: 50%; top: 76px; width: 360px; height: 360px; margin: -180px 0 0 -180px;
    background: repeating-conic-gradient(from 0deg, var(--c) 0deg 10deg, transparent 10deg 30deg);
    opacity: .18; border-radius: 50%; animation: unlock-rays 6s linear infinite;
    -webkit-mask: radial-gradient(circle, #000 20%, transparent 68%); mask: radial-gradient(circle, #000 20%, transparent 68%);
}
.badge-unlock-icon {
    position: relative; display: inline-block; filter: drop-shadow(0 0 14px var(--c));
    animation: unlock-icon 900ms cubic-bezier(.2, 1.6, .4, 1) 150ms both;
}
.badge-unlock-title { position: relative; margin-top: 10px; font-size: 13px; letter-spacing: .2em; color: #64748b; }
.badge-unlock-name { position: relative; margin-top: 2px; font-size: 28px; font-weight: 800; color: var(--c); }
.badge-unlock-praise { position: relative; margin-top: 8px; font-size: 14px; color: #334155; line-height: 1.6; }
.badge-unlock-hint { position: relative; margin-top: 14px; font-size: 12px; color: #94a3b8; }
@keyframes unlock-fade { 0% { opacity: 0; } 6% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 0; } }
@keyframes unlock-card { 0% { transform: scale(.7); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes unlock-icon { 0% { transform: scale(.2) rotate(-25deg); opacity: 0; } 60% { transform: scale(1.25) rotate(6deg); opacity: 1; } 100% { transform: scale(1) rotate(0); } }
@keyframes unlock-rays { to { transform: rotate(360deg); } }
/* 昨日评价仪式：全屏浅色遮罩 + 能量环 + 文案（--c = 等级色，"无"为灰）；时间线由 base.html 的 playRitual 控制 */
.ritual {
    position: fixed; inset: 0; z-index: 85; display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 24px 16px; overflow-y: auto; cursor: pointer; text-align: center;
    background: radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--c) 18%, #fff) 0%, #f8fafc 62%);
    animation: ritual-in 400ms ease-out both;
}
.ritual-body { width: min(360px, 100%); }
.ritual-title { margin-bottom: 6px; font-size: 14px; font-weight: 600; letter-spacing: .12em; color: #475569; }
.ritual-ring { width: min(300px, 76vw); margin: 0 auto; }
.ritual-praise { margin-top: 18px; font-size: 21px; font-weight: 800; line-height: 1.5; color: #0f172a; }
.ritual-stats { margin-top: 10px; min-height: 1.5em; font-size: 14px; color: #475569; }
.ritual-stats b { color: #0f172a; font-variant-numeric: tabular-nums; }
.ritual-dot { margin: 0 8px; color: #cbd5e1; }
.ritual-start {
    margin-top: 22px; min-height: 48px; padding: 0 40px; border-radius: 9999px; cursor: pointer;
    background: #4f46e5; color: #fff; font-size: 16px; font-weight: 700; box-shadow: 0 8px 24px rgba(79, 70, 229, .3);
}
.ritual-hint { margin-top: 18px; font-size: 12px; color: #94a3b8; transition: opacity .3s; }
.ritual-done .ritual-hint { opacity: 0; }
.ritual [data-ritual-step] { opacity: 0; transform: translateY(10px); transition: opacity 450ms ease-out, transform 450ms ease-out; }
.ritual [data-ritual-step]:not(.on) { pointer-events: none; }
.ritual [data-ritual-step].on { opacity: 1; transform: none; }
.ritual [data-ritual-reveal] { opacity: 0; transition: opacity 700ms ease-out; }
.ritual [data-ritual-reveal].on { opacity: 1; }
.ritual [data-ritual-badge] { opacity: 0; }
.ritual [data-ritual-badge].on { opacity: 1; }
.ritual-out { animation: ritual-out 300ms ease-in forwards; }
@keyframes ritual-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ritual-out { to { opacity: 0; } }
/* 页面内轻提示（替代 alert） */
.light-toast {
    position: fixed; z-index: 75; left: 50%; bottom: 88px; transform: translateX(-50%);
    max-width: calc(100% - 2rem); padding: 8px 16px; border-radius: 9999px;
    background: rgba(31, 41, 55, .92); color: #fff; font-size: 14px; pointer-events: none;
    animation: light-toast 2.8s ease-out forwards;
}
@keyframes light-toast { 0% { opacity: 0; } 8% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; } }
/* 减少动态效果：不上浮、不缩放、液面不过渡，只保留淡入淡出 */
@keyframes score-flash { 0% { opacity: 0; } 15% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } }
@keyframes badge-flash { 0% { opacity: .3; } 100% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
    .score-float { animation-name: score-flash; }
    .ring-seg, .ring-tip, .chip-layer { transition: none; }
    .ring-halo, .badge-unlock-rays { animation: none; }
    .badge-pop, .badge-unlock-card, .badge-unlock-icon { animation-name: badge-flash; }
    .ritual, .ritual-out { animation: none; }
    .ritual [data-ritual-step], .ritual [data-ritual-reveal] { transition: none; transform: none; }
}

/* 打卡日历：选中的那天加边框（box-shadow 不会被格子的等级底色盖住；今天另用实心圆标日期） */
.cal-day[aria-pressed="true"] {
    box-shadow: inset 0 0 0 2px #6366F1;
}
