/* 文渊 AI 文档助理 — design system extracted from the prototype
   palette: bg #EDEAE3 · paper #F5F3EF · ink #1F1E1C · sidebar #1C1B19 · accent #B23B34 */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #EDEAE3;
  --paper: #F5F3EF;
  --ink: #1F1E1C;
  --sidebar: #1C1B19;
  --accent: #B23B34;
  --accent-hover: #c94940;
  --line: #E8E4DD;
  --muted: #97938b;
  --muted2: #78756E;
  --soft-red: #FBEEEC;
}
body {
  font-family: "Noto Sans SC", system-ui, sans-serif;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  background: var(--bg);
}
a { color: var(--accent); text-decoration: none; }
a:hover { color: #8f2e28; }
button { font-family: inherit; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #d8d3ca; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #c4bdb1; background-clip: content-box; }
.feat-track::-webkit-scrollbar { display: none; }

@keyframes floatIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes pulseDot { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes spin { to { transform: rotate(360deg); } }

.serif { font-family: "Noto Serif SC", serif; }
.mono { font-family: "JetBrains Mono", monospace; }
.ph { background: repeating-linear-gradient(45deg,#efece6,#efece6 8px,#e7e3db 8px,#e7e3db 16px); }
.fade-in { animation: floatIn .4s ease; }

.app-shell { display: flex; height: 100vh; width: 100%; overflow: hidden; background: var(--bg); }

/* generic hover helper: elements with data-hover get a subtle lift handled in JS via class */
.hoverable { transition: background .15s, box-shadow .15s, transform .15s, border-color .15s; }

/* toast */
.toast {
  position: fixed; left: 50%; bottom: 40px; transform: translateX(-50%) translateY(20px);
  background: #1C1B19; color: #F5F3EF; padding: 12px 22px; border-radius: 12px;
  font-size: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.25); opacity: 0; pointer-events: none;
  transition: opacity .25s, transform .25s; z-index: 999; max-width: 80vw;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* spinner */
.spinner { width: 18px; height: 18px; border: 2px solid rgba(178,59,52,.25); border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; display: inline-block; }

/* modal */
.modal-mask {
  position: fixed; inset: 0; background: rgba(28,27,25,.42); display: flex;
  align-items: center; justify-content: center; z-index: 500; animation: floatIn .2s ease;
}
.modal-card {
  background: #fff; border-radius: 18px; padding: 30px 32px; width: 400px; max-width: 92vw;
  box-shadow: 0 24px 70px rgba(40,32,26,.3);
}

/* ---- PPT element animations (editor preview + 放映) ---- */
@keyframes aFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes aFadeUp { from { opacity: 0; transform: translateY(16px) } to { opacity: 1; transform: none } }
@keyframes aZoom { from { opacity: 0; transform: scale(.85) } to { opacity: 1; transform: none } }
@keyframes aSlideL { from { opacity: 0; transform: translateX(-28px) } to { opacity: 1; transform: none } }
@keyframes aFlip { from { opacity: 0; transform: perspective(600px) rotateY(70deg) } to { opacity: 1; transform: none } }
.anim-fade { animation: aFade .6s ease both }
.anim-fadeUp { animation: aFadeUp .6s ease both }
.anim-zoom { animation: aZoom .5s ease both }
.anim-slideL { animation: aSlideL .5s ease both }
.anim-flip { animation: aFlip .6s ease both }
/* ---- 放映 page transitions ---- */
@keyframes tFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes tFadeBlack { 0% { opacity: 0; filter: brightness(0) } 50% { filter: brightness(0) } 100% { opacity: 1; filter: none } }
@keyframes tZoomH { from { transform: scaleX(.4); opacity: .3 } to { transform: none; opacity: 1 } }
@keyframes tZoomV { from { transform: scaleY(.4); opacity: .3 } to { transform: none; opacity: 1 } }
@keyframes tCover { from { transform: translateX(100%) } to { transform: none } }
.present-stage.trans-fade { animation: tFade .5s ease both }
.present-stage.trans-fadeBlack { animation: tFadeBlack .7s ease both }
.present-stage.trans-zoomH { animation: tZoomH .5s ease both }
.present-stage.trans-zoomV { animation: tZoomV .5s ease both }
.present-stage.trans-cover { animation: tCover .5s ease both }

/* 空白的可编辑区显示占位提示（演讲备注） */
[contenteditable][data-ph]:empty::before {
  content: attr(data-ph);
  color: #b6b1a8;
  pointer-events: none;
}