.fade-enter-active,.fade-leave-active{transition:opacity .3s ease}.fade-enter-from,.fade-leave-to{opacity:0}:root{--ink-dark: #2c3e50;--ink-medium: #34495e;--ink-light: #95a5a6;--vermillion: #c0392b;--vermillion-light: #e74c3c;--bamboo: #27ae60;--bamboo-light: #2ecc71;--paper: #f8f5f0;--paper-dark: #ebe6dd;--gold: #d4af37;--gold-light: #f1c40f;--font-serif: "Noto Serif SC", "Source Han Serif SC", "STSong", serif;--font-sans: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", sans-serif;--spacing-xs: 8px;--spacing-sm: 12px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow-sm: 0 2px 8px rgba(44, 62, 80, .08);--shadow-md: 0 4px 16px rgba(44, 62, 80, .12);--shadow-lg: 0 8px 24px rgba(44, 62, 80, .15)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);background:linear-gradient(135deg,#f8f5f0,#ebe6dd);color:var(--ink-dark);line-height:1.8;min-height:100vh;background-image:repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,0,0,.01) 2px,rgba(0,0,0,.01) 4px)}#app{min-height:100vh;padding:var(--spacing-lg)}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);font-weight:600;color:var(--ink-dark);margin-bottom:var(--spacing-md)}h1{font-size:2rem;letter-spacing:.05em}h2{font-size:1.5rem;letter-spacing:.05em}h3{font-size:1.25rem}p{margin-bottom:var(--spacing-md);text-indent:2em}button{font-family:var(--font-sans);padding:var(--spacing-sm) var(--spacing-lg);border:2px solid var(--vermillion);background:linear-gradient(135deg,var(--vermillion) 0%,var(--vermillion-light) 100%);color:#fff;border-radius:var(--radius-sm);cursor:pointer;font-size:1rem;font-weight:500;transition:all .3s ease;position:relative;overflow:hidden}button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}button:hover:before{width:300px;height:300px}button:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}button:active{transform:translateY(0)}button.secondary{background:transparent;color:var(--ink-dark);border-color:var(--ink-light)}button.secondary:hover{background:var(--ink-dark);color:#fff;border-color:var(--ink-dark)}input,textarea{font-family:var(--font-sans);width:100%;padding:var(--spacing-sm);border:2px solid var(--paper-dark);background:#fff;border-radius:var(--radius-sm);font-size:1rem;color:var(--ink-dark);transition:all .3s ease;outline:none}input:focus,textarea:focus{border-color:var(--bamboo);box-shadow:0 0 0 3px #27ae601a}textarea{resize:vertical;min-height:100px;font-family:var(--font-serif);line-height:2;letter-spacing:.05em}.card{background:#fff;border-radius:var(--radius-md);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);box-shadow:var(--shadow-md);border:1px solid var(--paper-dark);transition:all .3s ease;position:relative}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--vermillion),var(--gold),var(--bamboo));border-radius:var(--radius-md) var(--radius-md) 0 0;opacity:0;transition:opacity .3s ease}.card:hover:before{opacity:1}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.container{max-width:800px;margin:0 auto}.loading{display:inline-block;width:40px;height:40px;border:3px solid var(--paper-dark);border-top-color:var(--vermillion);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes inkBlur{0%{filter:blur(0px);opacity:.3}50%{filter:blur(2px);opacity:.5}to{filter:blur(0px);opacity:.3}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--paper)}::-webkit-scrollbar-thumb{background:var(--ink-light);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--ink-medium)}.seal-decoration{display:inline-block;width:24px;height:24px;background:var(--vermillion);border-radius:2px;position:relative;box-shadow:inset 0 0 0 2px #fff}.seal-decoration:before{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;background:#fff;transform:translate(-50%,-50%) rotate(45deg)}@media (max-width: 768px){:root{font-size:14px}#app{padding:var(--spacing-md)}.container{max-width:100%}}