:root{--text: #6b6375;--text-h: #08060d;--bg: #fff;--border: #e5e4e7;--code-bg: #f4f3ec;--accent: #aa3bff;--accent-bg: rgba(170, 59, 255, .1);--accent-border: rgba(170, 59, 255, .5);--social-bg: rgba(244, 243, 236, .5);--shadow: rgba(0, 0, 0, .1) 0 10px 15px -3px, rgba(0, 0, 0, .05) 0 4px 6px -2px;--sans: system-ui, "Segoe UI", Roboto, sans-serif;--heading: system-ui, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (max-width: 1024px){:root{font-size:16px}}@media (prefers-color-scheme: dark){:root{--text: #9ca3af;--text-h: #f3f4f6;--bg: #16171d;--border: #2e303a;--code-bg: #1f2028;--accent: #c084fc;--accent-bg: rgba(192, 132, 252, .15);--accent-border: rgba(192, 132, 252, .5);--social-bg: rgba(47, 48, 58, .5);--shadow: rgba(0, 0, 0, .4) 0 10px 15px -3px, rgba(0, 0, 0, .25) 0 4px 6px -2px}#social .button-icon{filter:invert(1) brightness(2)}}body{margin:0}h1,h2{font-family:var(--heading);font-weight:500;color:var(--text-h)}h1{font-size:56px;letter-spacing:-1.68px;margin:32px 0}@media (max-width: 1024px){h1{font-size:36px;margin:20px 0}}h2{font-size:24px;line-height:118%;letter-spacing:-.24px;margin:0 0 8px}@media (max-width: 1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);display:inline-flex;border-radius:4px;color:var(--text-h)}code{font-size:15px;line-height:135%;padding:4px 8px;background:var(--code-bg)}.counter{font-size:16px;padding:5px 10px;border-radius:5px;color:var(--accent);background:var(--accent-bg);border:2px solid transparent;transition:border-color .3s;margin-bottom:24px}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{inset-inline:0;margin:0 auto}.hero .base{width:170px;position:relative;z-index:0}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;top:34px;height:28px;transform:perspective(2000px) rotate(300deg) rotateX(44deg) rotateY(39deg) scale(1.4)}.hero .vite{z-index:0;top:107px;height:26px;width:auto;transform:perspective(2000px) rotate(300deg) rotateX(40deg) rotateY(39deg) scale(.8)}#app{width:1126px;max-width:100%;margin:0 auto;text-align:center;border-inline:1px solid var(--border);min-height:100svh;display:flex;flex-direction:column;box-sizing:border-box}#center{display:flex;flex-direction:column;gap:25px;place-content:center;place-items:center;flex-grow:1}@media (max-width: 1024px){#center{padding:32px 20px 24px;gap:18px}}#next-steps{display:flex;border-top:1px solid var(--border);text-align:left}#next-steps>div{flex:1 1 0;padding:32px}@media (max-width: 1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{margin-bottom:16px;width:22px;height:22px}@media (max-width: 1024px){#next-steps{flex-direction:column;text-align:center}}#docs{border-right:1px solid var(--border)}@media (max-width: 1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{list-style:none;padding:0;display:flex;gap:8px;margin:32px 0 0}#next-steps ul .logo{height:18px}#next-steps ul a{color:var(--text-h);font-size:16px;border-radius:6px;background:var(--social-bg);display:flex;padding:6px 12px;align-items:center;gap:8px;text-decoration:none;transition:box-shadow .3s}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{height:18px;width:18px}@media (max-width: 1024px){#next-steps ul{margin-top:20px;flex-wrap:wrap;justify-content:center}#next-steps ul li{flex:1 1 calc(50% - 8px)}#next-steps ul a{width:100%;justify-content:center;box-sizing:border-box}}#spacer{height:88px;border-top:1px solid var(--border)}@media (max-width: 1024px){#spacer{height:48px}}.ticks{position:relative;width:100%}.ticks:before,.ticks:after{content:"";position:absolute;top:-4.5px;border:5px solid transparent}.ticks:before{left:0;border-left-color:var(--border)}.ticks:after{right:0;border-right-color:var(--border)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,Microsoft YaHei,sans-serif;background:#f5f5f5;color:#333}.nav{display:flex;justify-content:space-between;align-items:center;padding:16px 40px;background:#fff;box-shadow:0 1px 4px #0000000f}.logo{font-size:20px;font-weight:700;color:#333;text-decoration:none}.nav nav a{margin-left:20px;color:#666;text-decoration:none}.nav nav a:hover{color:#409eff}.main{max-width:900px;margin:40px auto;padding:0 20px}h1[data-v-a82f7c22]{margin-bottom:24px;font-size:24px}.post-card[data-v-a82f7c22]{display:block;background:#fff;padding:20px 24px;margin-bottom:16px;border-radius:8px;text-decoration:none;color:inherit;box-shadow:0 1px 4px #0000000f;transition:box-shadow .2s}.post-card[data-v-a82f7c22]:hover{box-shadow:0 4px 12px #0000001a}.post-card h2[data-v-a82f7c22]{font-size:18px;margin-bottom:10px;color:#222}.meta[data-v-a82f7c22]{font-size:13px;color:#888}.category[data-v-a82f7c22]{background:#e8f4ff;color:#409eff;padding:2px 8px;border-radius:4px;margin-right:8px}.tag[data-v-a82f7c22]{margin-right:6px;color:#666}.date[data-v-a82f7c22]{float:right}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}.back[data-v-e32b43fc]{display:inline-block;color:#409eff;text-decoration:none;margin-bottom:20px}h1[data-v-e32b43fc]{font-size:28px;margin-bottom:16px}.meta[data-v-e32b43fc]{font-size:13px;color:#888;margin-bottom:30px;padding-bottom:16px;border-bottom:1px solid #eee}.category[data-v-e32b43fc]{background:#e8f4ff;color:#409eff;padding:2px 8px;border-radius:4px;margin-right:8px}.tag[data-v-e32b43fc]{margin-right:6px;color:#666}.date[data-v-e32b43fc]{float:right}.content[data-v-e32b43fc]{background:#fff;padding:30px 40px;border-radius:8px;line-height:1.8;color:#333}.content[data-v-e32b43fc] h1,.content[data-v-e32b43fc] h2,.content[data-v-e32b43fc] h3{margin:20px 0 12px}.content[data-v-e32b43fc] p{margin:12px 0}.content[data-v-e32b43fc] code{background:#f5f5f5;padding:2px 6px;border-radius:3px;font-family:Consolas,Monaco,monospace;font-size:.9em}.content[data-v-e32b43fc] pre{background:#f6f8fa;padding:16px;border-radius:6px;overflow-x:auto;margin:16px 0}.content[data-v-e32b43fc] pre code{background:none;padding:0}.content[data-v-e32b43fc] blockquote{border-left:4px solid #409eff;padding-left:16px;color:#666;margin:16px 0}.content[data-v-e32b43fc] ul,.content[data-v-e32b43fc] ol{margin:12px 0 12px 24px}.loading[data-v-e32b43fc],.not-found[data-v-e32b43fc]{text-align:center;padding:60px 20px;color:#888}.login[data-v-13258595]{max-width:400px;margin:60px auto;background:#fff;padding:40px;border-radius:8px;box-shadow:0 2px 12px #00000014}h1[data-v-13258595]{text-align:center;margin-bottom:30px;font-size:22px}.form-item[data-v-13258595]{margin-bottom:20px}label[data-v-13258595]{display:block;margin-bottom:6px;font-size:14px;color:#555}input[data-v-13258595]{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;box-sizing:border-box}input[data-v-13258595]:focus{outline:none;border-color:#409eff}button[data-v-13258595]{width:100%;padding:12px;background:#409eff;color:#fff;border:none;border-radius:4px;font-size:15px;cursor:pointer;margin-top:10px}button[data-v-13258595]:hover:not(:disabled){background:#3078d0}button[data-v-13258595]:disabled{background:#a0cfff;cursor:not-allowed}.error[data-v-13258595]{color:#f56c6c;text-align:center;margin-top:15px;font-size:14px}.header[data-v-f43a6774]{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.header h1[data-v-f43a6774]{font-size:24px}.welcome[data-v-f43a6774]{margin-right:12px;color:#666}.logout[data-v-f43a6774]{padding:6px 14px;background:#f0f0f0;border:none;border-radius:4px;cursor:pointer;color:#666}.logout[data-v-f43a6774]:hover{background:#e0e0e0}.not-login[data-v-f43a6774]{text-align:center;padding:60px 20px;background:#fff;border-radius:8px}.btn-login[data-v-f43a6774]{display:inline-block;margin-top:16px;padding:10px 24px;background:#409eff;color:#fff;text-decoration:none;border-radius:4px}.card[data-v-f43a6774]{background:#fff;padding:24px 28px;border-radius:8px;margin-bottom:20px;box-shadow:0 1px 4px #0000000f}.card h2[data-v-f43a6774]{font-size:18px;margin-bottom:20px}.form-item[data-v-f43a6774]{margin-bottom:16px}label[data-v-f43a6774]{display:block;margin-bottom:6px;font-size:14px;color:#555}input[data-v-f43a6774],textarea[data-v-f43a6774]{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit;box-sizing:border-box}textarea[data-v-f43a6774]{font-family:Consolas,Monaco,monospace;resize:vertical}input[data-v-f43a6774]:focus,textarea[data-v-f43a6774]:focus{outline:none;border-color:#409eff}.btn-publish[data-v-f43a6774]{padding:10px 30px;background:#409eff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:15px}.btn-publish[data-v-f43a6774]:disabled{background:#a0cfff;cursor:not-allowed}.message[data-v-f43a6774]{margin-top:14px;font-size:14px}.message.success[data-v-f43a6774]{color:#67c23a}.message.error[data-v-f43a6774]{color:#f56c6c}.post-row[data-v-f43a6774]{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #f0f0f0}.post-row[data-v-f43a6774]:last-child{border-bottom:none}.post-meta[data-v-f43a6774]{margin-left:12px;color:#999;font-size:13px}.btn-delete[data-v-f43a6774]{padding:4px 12px;background:#fef0f0;color:#f56c6c;border:none;border-radius:4px;cursor:pointer;font-size:13px}.btn-delete[data-v-f43a6774]:hover{background:#fde2e2}
