@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --sat: env(safe-area-inset-top);
  --sar: env(safe-area-inset-right);
  --sab: env(safe-area-inset-bottom);
  --sal: env(safe-area-inset-left);
}

html, body, #root {
  height: 100%;
  height: 100dvh;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body {
  /* 使用系统衬线字体栈 */
  font-family: "Songti SC", "SimSun", "STSong", "AR PL New Sung", "Times New Roman", serif;
  background-color: #F8F8F6;
  color: #0F172A;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.pt-safe { padding-top: var(--sat); }
.pb-safe { padding-bottom: var(--sab); }

.text-vivid {
  text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* 宣纸多层纹理 */
.xuan-paper {
  background-color: #F8F8F6;
  background-image: 
    radial-gradient(at 0% 0%, rgba(242, 242, 236, 0.5) 0px, transparent 50%),
    radial-gradient(at 100% 100%, rgba(255, 255, 255, 0.8) 0px, transparent 50%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");
}

/* 毛边效果 */
.ink-border {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='f'%3E%3CfeTurbulence baseFrequency='0.05'/%3E%3CfeDisplacementMap in='SourceGraphic' scale='5'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23f)'/%3E%3C/svg%3E");
}