/* ============================================================
   Neco API · 可爱主题 v1 (cute-theme-20260613)
   ------------------------------------------------------------
   纯叠加样式:不改布局、不改功能、不动任何组件结构。
   移除本文件引用即可 100% 回退。
   设计原则:圆润、柔和、轻盈的微动效,浅色/深色模式都适配。
   ============================================================ */

/* ---------- 1. 全局设计令牌:更圆润的圆角 ---------- */
/* 注:!important 用于压过动态加载的公告样式包(notice-design)对同名
   变量的二次定义,并非压组件样式本身。 */
body {
  --semi-border-radius-extra-small: 6px !important;
  --semi-border-radius-small: 10px !important;
  --semi-border-radius-medium: 14px !important;
  --semi-border-radius-large: 18px !important;
}

/* ---------- 2. 主色:柔和的薰衣草紫(和现有粉蓝渐变背景呼应) ---------- */
body {
  --semi-color-primary: #8b7cf6 !important;
  --semi-color-primary-hover: #7c6ce8 !important;
  --semi-color-primary-active: #6d5dd6 !important;
  --semi-color-primary-light-default: rgba(139, 124, 246, 0.12) !important;
  --semi-color-primary-light-hover: rgba(139, 124, 246, 0.2) !important;
  --semi-color-primary-light-active: rgba(139, 124, 246, 0.28) !important;
  --semi-color-focus-border: rgba(139, 124, 246, 0.45) !important;
}
body[theme-mode='dark'] {
  --semi-color-primary: #a89bff !important;
  --semi-color-primary-hover: #b8adff !important;
  --semi-color-primary-active: #9788f0 !important;
  --semi-color-primary-light-default: rgba(168, 155, 255, 0.16) !important;
  --semi-color-primary-light-hover: rgba(168, 155, 255, 0.24) !important;
  --semi-color-primary-light-active: rgba(168, 155, 255, 0.32) !important;
}

/* ---------- 3. 按钮:圆润 + 轻盈的触感 ---------- */
body .semi-button {
  border-radius: 12px;
  transition:
    transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1),
    box-shadow 0.16s ease,
    background-color 0.16s ease;
}
body .semi-button:not(.semi-button-disabled):hover {
  transform: translateY(-1px);
}
body .semi-button:not(.semi-button-disabled):active {
  transform: translateY(0) scale(0.97);
}
body .semi-button-primary:not(.semi-button-disabled):not(.semi-button-borderless):not(.semi-button-light) {
  box-shadow: 0 2px 10px rgba(139, 124, 246, 0.28);
}
body .semi-button-primary:not(.semi-button-disabled):not(.semi-button-borderless):not(.semi-button-light):hover {
  box-shadow: 0 4px 16px rgba(139, 124, 246, 0.38);
}

/* ---------- 4. 卡片:更圆 + 悬浮时轻轻"抬起" ---------- */
body .semi-card {
  border-radius: 18px;
  transition: box-shadow 0.22s ease, transform 0.22s ease;
}
body .semi-card:hover {
  box-shadow: 0 6px 24px rgba(139, 124, 246, 0.10);
}
body[theme-mode='dark'] .semi-card:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
}

/* ---------- 5. 输入框 / 选择器:圆润边角 + 柔和聚焦光圈 ---------- */
body .semi-input-wrapper,
body .semi-select,
body .semi-tagInput,
body .semi-datepicker-range-input,
body .semi-input-textarea-wrapper {
  border-radius: 12px;
}
body .semi-input-wrapper-focus,
body .semi-select-focus {
  box-shadow: 0 0 0 3px rgba(139, 124, 246, 0.16);
}

/* ---------- 6. 弹窗 / 抽屉 / 下拉:大圆角 ---------- */
body .semi-modal-content {
  border-radius: 20px;
}
body .semi-sidesheet-inner {
  border-radius: 20px 0 0 20px;
}
body .semi-dropdown,
body .semi-popover-wrapper,
body .semi-select-option-list {
  border-radius: 14px;
}

/* ---------- 7. 标签 / 徽章:胶囊形 ---------- */
body .semi-tag {
  border-radius: 999px;
}

/* ---------- 8. 表格:行悬浮淡紫提示 + 圆角表头 ---------- */
body .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
  background-color: rgba(139, 124, 246, 0.05);
}
body[theme-mode='dark'] .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
  background-color: rgba(168, 155, 255, 0.08);
}

/* ---------- 9. 导航 / 侧边栏选中项:圆润胶囊 ---------- */
body .semi-navigation-item {
  border-radius: 12px;
  transition: background-color 0.16s ease, transform 0.16s ease;
}
body .semi-navigation-item:hover {
  transform: translateX(1px);
}

/* ---------- 10. 滚动条:细圆柔和 ---------- */
body ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
body ::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(139, 124, 246, 0.30);
}
body ::-webkit-scrollbar-thumb:hover {
  background: rgba(139, 124, 246, 0.50);
}
body ::-webkit-scrollbar-track {
  background: transparent;
}

/* ---------- 11. 头像:悬浮时俏皮地轻轻放大 ---------- */
body .semi-avatar {
  transition: transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1);
}
body .semi-avatar:hover {
  transform: scale(1.06) rotate(-2deg);
}

/* ---------- 12. 开关:打开时带一点弹性 ---------- */
body .semi-switch-knob {
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

/* ---------- 13. 分页 / 步骤条圆角 ---------- */
body .semi-page-item {
  border-radius: 10px;
}

/* ---------- 14. 骨架屏 / 加载:柔和呼吸 ---------- */
@keyframes cuteBreath {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}
body .semi-skeleton-paragraph,
body .semi-skeleton-title,
body .semi-skeleton-avatar,
body .semi-skeleton-image,
body .semi-skeleton-button {
  animation: cuteBreath 1.6s ease-in-out infinite;
  border-radius: 10px;
}

/* ---------- 15. 尊重系统"减少动态效果"偏好 ---------- */
@media (prefers-reduced-motion: reduce) {
  body .semi-button,
  body .semi-card,
  body .semi-avatar,
  body .semi-navigation-item {
    transition: none;
  }
  body .semi-skeleton-paragraph,
  body .semi-skeleton-title,
  body .semi-skeleton-avatar,
  body .semi-skeleton-image,
  body .semi-skeleton-button {
    animation: none;
  }
}

/* ---------- 16. 登录通知小组件换装 ----------
   login-notice-admin 组件用内联样式硬编码了蓝色(#2563eb)和小圆角,
   无法走主题变量;通过其特有的 z-index 内联值定位并统一为主题紫。 */
body > div[style*='2147483647'] > div {
  border-radius: 18px !important;
}
body > div[style*='2147483647'] button {
  background: #8b7cf6 !important;
  border-radius: 12px !important;
}

/* ---------- 17. 公告历史小组件(nhv)换装 ----------
   notice-history-v2 组件把蓝色写死在注入的 <style> 里,这里统一为主题紫。 */
body #neco-notice-history-v2-modal .nhv-card {
  border-radius: 20px !important;
}
body .nhv-dot {
  background: #8b7cf6 !important;
}
body .nhv-foot .nhv-primary {
  background: #8b7cf6 !important;
  border-color: #8b7cf6 !important;
}
body .nhv-foot .nhv-primary:hover {
  background: #7c6ce8 !important;
  border-color: #7c6ce8 !important;
}
body .nhv-foot button {
  border-radius: 12px !important;
}

/* ============================================================
   19. 全站按钮/交互微特效
   ============================================================ */
body .semi-button { position: relative; overflow: hidden; }
.neco-ripple {
  position: absolute; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.45) 0%, rgba(139,124,246,.25) 45%, transparent 70%);
  transform: scale(0); opacity: .8;
  animation: necoRipple .55s ease-out forwards;
  will-change: transform, opacity;
}
@keyframes necoRipple { to { transform: scale(1); opacity: 0; } }

/* 主按钮：渐变流光底 + 悬浮掠光 */
body .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-disabled) {
  background-image: linear-gradient(120deg, #8b7cf6, #9d8bf8 45%, #b89df3);
}
body .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-disabled)::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: -130%; width: 60%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg);
  transition: left .45s ease;
  pointer-events: none;
}
body .semi-button-primary:not(.semi-button-disabled):hover::after { left: 160%; }

/* 卡片入场轻浮现 */
@keyframes necoRise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
body .semi-card { animation: necoRise .24s ease-out; }

/* 减少动效偏好：全部静默 */
@media (prefers-reduced-motion: reduce) {
  #neco-intro, .neco-ripple { display: none !important; }
  body .semi-card { animation: none; }
  body .semi-button-primary::after { display: none; }
}

/* ============================================================
   20. 随机开幕特效库（neco-reveal，~1.2s 自毁）
   幕布统一用站点同款粉蓝渐变（nr-bg），感觉是页面自己展开
   ============================================================ */
#neco-reveal { position: fixed; inset: 0; z-index: 2147483646; pointer-events: none; overflow: hidden; }
.nr-bg {
  background:
    radial-gradient(120% 160% at 12% 0%, rgba(244,184,215,.5), transparent 55%),
    radial-gradient(120% 160% at 88% 100%, rgba(150,188,248,.5), transparent 55%),
    linear-gradient(135deg, #f6f3ff 0%, #fdf4fa 50%, #f1f5ff 100%);
}
/* 页面本体：从景深中聚焦浮现（四种开幕共用） */
.neco-revealing #root {
  animation: nrPageIn .68s cubic-bezier(.22,1,.36,1) .3s backwards;
  will-change: transform, opacity, filter;
}
@keyframes nrPageIn {
  0% { opacity: 0; transform: scale(.955) translateY(14px); filter: blur(8px); }
  60% { filter: blur(0); }
  100% { opacity: 1; transform: scale(1) translateY(0); filter: none; }
}
/* 开幕期间隐藏顶层弹窗 */
.neco-revealing body > div[style*='2147483647'],
.neco-revealing #neco-notice-history-v2-modal,
.neco-revealing .semi-portal { visibility: hidden !important; }
/* 星光迸溅（V1/V3 共用） */
.nr-spark {
  position: absolute; width: 7px; height: 7px; border-radius: 50%;
  background: radial-gradient(circle, #fff, #c4b5fd 70%, transparent);
  box-shadow: 0 0 10px 2px rgba(196,181,253,.9);
  transform: translate(-50%,-50%);
  animation: nrSpark .6s ease-out forwards;
  will-change: transform, opacity;
}
@keyframes nrSpark {
  0% { transform: translate(-50%,-50%) scale(1); opacity: 1; }
  100% { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(.2); opacity: 0; }
}

/* ---------- V1 光刃斩击 ---------- */
.nr-shard { position: absolute; inset: 0; will-change: transform, opacity; transition: transform .6s cubic-bezier(.65,.05,.35,1), opacity .6s ease; }
.nr-shard-a { clip-path: polygon(0 0, 100% 0, 100% 100%); }
.nr-shard-b { clip-path: polygon(0 0, 100% 100%, 0 100%); }
.nr-v1.nr-open .nr-shard-a { transform: translate(16%, -112%) rotate(3deg); opacity: .6; }
.nr-v1.nr-open .nr-shard-b { transform: translate(-16%, 112%) rotate(3deg); opacity: .6; }
.nr-slash { position: absolute; top: 50%; left: 50%; height: 3px; pointer-events: none; }
.nr-blade {
  position: absolute; inset: 0; border-radius: 999px; transform: scaleX(0); transform-origin: left center;
  background: linear-gradient(90deg, transparent, #c4b5fd 12%, #fff 50%, #c4b5fd 88%, transparent);
  box-shadow: 0 0 16px 3px rgba(196,181,253,.9), 0 0 44px 9px rgba(244,184,215,.5);
  animation: nrBlade .22s cubic-bezier(.2,.8,.3,1) forwards;
  will-change: transform;
}
@keyframes nrBlade { to { transform: scaleX(1); } }
.nr-comet {
  position: absolute; top: 50%; left: 0; width: 26px; height: 26px; border-radius: 50%;
  transform: translate(-50%,-50%);
  background: radial-gradient(circle, #fff 18%, rgba(196,181,253,.85) 45%, transparent 70%);
  box-shadow: 0 0 22px 8px rgba(255,255,255,.75);
  animation: nrComet .22s cubic-bezier(.2,.8,.3,1) forwards;
  will-change: left, opacity;
}
@keyframes nrComet { 0% { left: 0; opacity: 1; } 90% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
.nr-v1.nr-open .nr-blade { animation: nrBladeFade .4s ease-out forwards; }
@keyframes nrBladeFade { to { opacity: 0; transform: scaleX(1) scaleY(5); } }

/* ---------- V2 映画百叶 ---------- */
.nr-strip {
  position: absolute; top: 0; bottom: 0; will-change: transform, opacity;
  background-size: 100vw 100vh; background-repeat: no-repeat;
  transition: transform .5s cubic-bezier(.6,.04,.35,1), opacity .5s ease;
}
.nr-v2.nr-open .nr-strip:nth-child(odd) { transform: translateY(-104%) skewY(-4deg); opacity: .7; }
.nr-v2.nr-open .nr-strip:nth-child(even) { transform: translateY(104%) skewY(4deg); opacity: .7; }
.nr-glowline {
  position: absolute; top: 0; bottom: 0; width: 3px; left: 0; opacity: 0;
  background: linear-gradient(180deg, transparent, #c4b5fd 20%, #fff 50%, #c4b5fd 80%, transparent);
  box-shadow: 0 0 18px 4px rgba(196,181,253,.8);
  animation: nrGlowSweep .55s ease-in-out .1s;
  will-change: transform, opacity;
}
@keyframes nrGlowSweep { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(100vw); } }

/* ---------- V3 冲击波穿越 ---------- */
.nr-full { position: absolute; inset: 0; will-change: transform, opacity; transition: transform .62s cubic-bezier(.5,0,.7,.4), opacity .58s ease; }
.nr-v3.nr-open .nr-full { transform: scale(1.9); opacity: 0; }
.nr-core {
  position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; border-radius: 50%;
  transform: translate(-50%,-50%) scale(0);
  background: radial-gradient(circle, #fff, rgba(196,181,253,.9) 60%, transparent);
  box-shadow: 0 0 36px 14px rgba(255,255,255,.85);
  animation: nrCore .3s ease-out forwards;
  will-change: transform, opacity;
}
@keyframes nrCore { 0% { transform: translate(-50%,-50%) scale(0); } 70% { transform: translate(-50%,-50%) scale(1.4); opacity: 1; } 100% { transform: translate(-50%,-50%) scale(1); opacity: .9; } }
.nr-ring {
  position: absolute; top: 50%; left: 50%; width: 60px; height: 60px; border-radius: 50%;
  transform: translate(-50%,-50%) scale(0); opacity: 0;
  border: 3px solid rgba(196,181,253,.9);
  box-shadow: 0 0 24px 6px rgba(196,181,253,.5), inset 0 0 18px rgba(244,184,215,.5);
  will-change: transform, opacity;
}
.nr-v3.nr-open .nr-ring { animation: nrRing .6s cubic-bezier(.2,.7,.3,1) forwards; }
.nr-v3.nr-open .nr-ring2 { animation-delay: .12s; border-color: rgba(244,184,215,.85); }
@keyframes nrRing { 0% { transform: translate(-50%,-50%) scale(.2); opacity: 1; } 100% { transform: translate(-50%,-50%) scale(28); opacity: 0; } }

/* ---------- V4 星尘瓦解 ---------- */
.nr-tile {
  position: absolute; will-change: transform, opacity;
  background-size: 100vw 100vh; background-repeat: no-repeat;
  transition: transform .42s cubic-bezier(.5,0,.75,.3), opacity .42s ease;
}
.nr-v4.nr-open .nr-tile { transform: scale(.05) rotate(var(--tr, 10deg)); opacity: 0; }

/* ============================================================
   21. 按钮点击随机特效（顶层渲染层）
   ============================================================ */
#neco-fx-layer { position: fixed; inset: 0; z-index: 2147483645; pointer-events: none; }
.neco-fx { position: absolute; transform: translate(-50%,-50%); pointer-events: none; font-style: normal; will-change: transform, opacity; }
.fx-ring {
  width: 14px; height: 14px; border-radius: 50%;
  border: 2.5px solid rgba(139,124,246,.85);
  box-shadow: 0 0 12px 2px rgba(139,124,246,.45);
  animation: fxRing .5s ease-out forwards;
}
@keyframes fxRing { 0% { transform: translate(-50%,-50%) scale(.4); opacity: 1; } 100% { transform: translate(-50%,-50%) scale(4.6); opacity: 0; } }
.fx-star {
  color: #ffd76a; text-shadow: 0 0 8px rgba(255,215,106,.9);
  animation: fxStar .55s ease-out forwards;
}
@keyframes fxStar {
  0% { transform: translate(-50%,-50%) scale(.4) rotate(0); opacity: 1; }
  100% { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.1) rotate(140deg); opacity: 0; }
}
.fx-heart { font-size: 15px; animation: fxHeart .8s ease-out forwards; }
@keyframes fxHeart {
  0% { transform: translate(-50%,-50%) scale(.3); opacity: 0; }
  25% { transform: translate(-50%,-90%) scale(1.15) rotate(-8deg); opacity: 1; }
  100% { transform: translate(-50%,-260%) scale(.9) rotate(10deg); opacity: 0; }
}
.fx-paw { font-size: 16px; animation: fxPaw .65s ease-out forwards; }
@keyframes fxPaw {
  0% { transform: translate(-50%,-50%) scale(.2) rotate(var(--rot, 0deg)); opacity: 0; }
  35% { transform: translate(-50%,-50%) scale(1.25) rotate(var(--rot, 0deg)); opacity: 1; }
  100% { transform: translate(-50%,-50%) scale(1) rotate(var(--rot, 0deg)); opacity: 0; }
}
.fx-confetti {
  width: 7px; height: 10px; border-radius: 2px;
  animation: fxConfetti .7s cubic-bezier(.2,.6,.6,1) forwards;
}
@keyframes fxConfetti {
  0% { transform: translate(-50%,-50%) rotate(0); opacity: 1; }
  100% { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(var(--rot, 120deg)); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #neco-reveal, #neco-fx-layer { display: none !important; }
  .neco-revealing #root { animation: none; }
}
