:root{--sans: system-ui, "Segoe UI", Roboto, sans-serif;--heading: system-ui, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, Consolas, monospace;--code-bg: #f4f3ec;--accent: #F37021;--accent-bg: rgba(243, 112, 33, .1);--accent-border: rgba(243, 112, 33, .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;font:18px/145% var(--sans);letter-spacing:.18px;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(max-width:1024px){:root{font-size:16px}}.theme-dark{--bg: #000000;--text: #ffffff;--text-h: #ffffff;--border: rgba(255, 255, 255, .1);background-color:var(--bg)!important;color:var(--text)!important;min-height:100vh;width:100%}.theme-light{--bg: #ffffff;--text: #6b6375;--text-h: #08060d;--border: #e5e4e7;background-color:var(--bg)!important;color:var(--text)!important;min-height:100vh;width:100%}body{margin:0;background-color:transparent}#root{width:100%;max-width:100%;margin:0 auto;text-align:center;min-height:100svh;display:flex;flex-direction:column;box-sizing:border-box}h1,h2{font-family:var(--heading);font-weight:500;color:var(--text-h)}h1{font-size:56px;letter-spacing:-1.68px;margin:32px 0}h2{font-size:24px;line-height:118%;letter-spacing:-.24px;margin:0 0 8px}@media(max-width:1024px){h1{font-size:36px;margin:20px 0}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)}.nine-logo{position:relative;top:8px;background:#f37021;display:flex;align-items:center;gap:8px;transform:rotate(-4deg);padding:8px 12px 4px;animation:logo-vibe 6s ease-in-out infinite;overflow:hidden}.nine-logo .icon-home{display:inline-block;width:16px;height:16px;background-color:#f9f9f9;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8.707 1.5a1 1 0 0 0-1.414 0L.646 8.146a.5.5 0 0 0 .708.708L2 8.207V13.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V8.207l.646.647a.5.5 0 0 0 .708-.708L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293zM13 7.207V13.5a.5.5 0 0 1-.5-.5h-9a.5.5 0 0 1-.5-.5V7.207l5-5z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8.707 1.5a1 1 0 0 0-1.414 0L.646 8.146a.5.5 0 0 0 .708.708L2 8.207V13.5A1.5 1.5 0 0 0 3.5 15h9a1.5 1.5 0 0 0 1.5-1.5V8.207l.646.647a.5.5 0 0 0 .708-.708L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293zM13 7.207V13.5a.5.5 0 0 1-.5-.5h-9a.5.5 0 0 1-.5-.5V7.207l5-5z'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:100% 100%;mask-size:100% 100%}.nine-logo .brand-name{font-weight:400;font-size:1.05rem;color:#f0f0f0;letter-spacing:-.02em;overflow:hidden;padding-right:4px;text-decoration:none;display:flex;align-items:center;gap:4px;transition:transform .2s ease}.nine-logo .brand-name .brand-primary{font-weight:400}.nine-logo .brand-name:hover svg{color:#eee}.nine-logo .brand-name:after{content:"";position:absolute;bottom:-200px;left:50%;width:40px;height:400px;background:linear-gradient(0deg,#fff0,#ffffff80 40%,#fff,#ffffff80 60%,#fff0),conic-gradient(from 175deg at top center,transparent 0%,rgba(255,255,255,1) 50%,transparent 100%);background-blend-mode:overlay;transform-origin:center bottom;filter:blur(.5px) drop-shadow(0 0 12px rgba(255,255,255,1));animation:box-roadrunner 6s ease-in-out infinite;opacity:0;pointer-events:none}.nine-top-menu{position:fixed;top:0;left:0;right:0;height:2px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;justify-content:space-between;align-items:center;padding:0 24px;z-index:9999;border-top:2px solid #F37021;--border-bottom: 1px solid rgba(0, 0, 0, .08)}.nine-top-menu .nav-right{position:relative;top:8px}.nine-top-menu .nav-right a{margin-left:20px;text-decoration:none;color:#000;font-size:.85rem;font-weight:500;transition:all .2s ease}.nine-top-menu .nav-right a:hover{color:#007aff}@keyframes logo-vibe{0%,45%{transform:rotate(-4deg) scale(1)}50%{transform:rotate(-4.8deg) scale(1.015)}60%{transform:rotate(-3.2deg) scale(1.015)}70%{transform:rotate(-4.2deg) scale(1.01)}80%,to{transform:rotate(-4deg) scale(1)}}@keyframes box-roadrunner{0%,40%{transform:translate(-50%) rotate(-60deg);opacity:0}45%{opacity:1;transform:translate(-50%) rotate(-40deg)}55%{transform:translate(-50%) rotate(40deg)}60%,65%{transform:translate(-50%) rotate(45deg);opacity:1}75%{transform:translate(-50%) rotate(-25deg)}90%{transform:translate(-50%) rotate(70deg);opacity:0}to{opacity:0}}@media(max-width:768px){.nine-top-menu .nav-right{top:32px;display:flex;flex-direction:row;gap:8px;align-items:flex-start}.nine-top-menu .nav-right a{margin-left:0;font-size:.85rem;font-weight:600;writing-mode:vertical-rl;text-orientation:keep-all;width:fit-content;padding:10px 2px;line-height:1;white-space:nowrap;border-bottom:none}}@media(prefers-color-scheme:dark){#social .button-icon{filter:invert(1) brightness(2)}}.use-case .scenario-image-wrap{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;gap:40px;margin:60px auto;max-width:1400px;padding:0 20px}.use-case .image-item{flex:1;text-align:center;min-width:0}.use-case .scenario-subject{font-size:1.4rem;font-weight:700;color:#111;margin-bottom:24px;word-break:keep-all}.use-case .case-img{width:100%;aspect-ratio:16 / 10;background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:8px;box-shadow:0 4px 20px #0000000d;background-color:#f5f5f5}.use-case .case-1{background-image:url(/board/images/use-case-1.png)}.use-case .case-2{background-image:url(/board/images/use-case-2.png)}@media(max-width:1024px){.use-case .scenario-image-wrap{flex-direction:column;align-items:center;gap:80px}.use-case .image-item{width:100%;max-width:700px}.use-case .case-img{aspect-ratio:16 / 9}}.contact-us{display:flex;flex-direction:column;gap:16px;margin-bottom:60px}.contact-us .contact-card{padding:40px 0;border-top:1px solid #f0f0f0}.contact-us .contact-card .method-label{font-size:11px;font-weight:800;color:#94a3b8;text-transform:uppercase;margin-bottom:12px}.contact-us .contact-card .method-value{font-size:1.4rem;font-weight:700;color:#111;margin-bottom:8px}.contact-us .contact-card .chat-link{display:inline-block;font-size:1.4rem;font-weight:700;color:#f37021;text-decoration:none;margin-bottom:8px}.contact-us .contact-card .chat-link:hover{text-decoration:underline}.contact-us .contact-card .method-desc{font-size:.9rem;color:#888}.guide-footer{padding:40px 24px;max-width:940px;margin:0 auto;border-top:1px solid #f0f0f0}.guide-footer .footer-content p{font-size:12px;color:#94a3b8;letter-spacing:.02em}.contact .contact-label{display:block;font-size:11px;font-weight:700;color:#f37021;text-transform:uppercase;letter-spacing:.15em;margin-bottom:16px}.contact .contact-footer{padding:32px;background:#f9f9f9;border-radius:4px}.contact .contact-footer .license-info{font-size:.95rem;color:#444;line-height:1.7;word-break:keep-all}.contact .contact-footer .license-info strong{color:#111;font-weight:700}@media(max-width:768px){.contact .method-value,.contact .chat-link{font-size:1.2rem}}.live-demo{@keyframes sync-flow{0%{background-position:0 0}to{background-position:12px 0}}}.live-demo .dual-window-layout{display:flex;align-items:center;gap:24px;margin-top:40px}.live-demo .demo-window{flex:1;background:#fff;border-radius:12px;overflow:hidden;border:1px solid #111;border-top:4px solid #111}.live-demo .demo-window.loaded{box-shadow:0 20px 40px #00000014}.live-demo .window-bar{height:40px;background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;padding:0 16px}.live-demo .window-bar .dots{display:flex;gap:6px}.live-demo .window-bar .dots .dot{width:10px;height:10px;border-radius:50%;background:#e2e8f0}.live-demo .window-bar .dots .dot.red{background:#ff5f56}.live-demo .window-bar .dots .dot.yellow{background:#ffbd2e}.live-demo .window-bar .dots .dot.green{background:#27c93f}.live-demo .window-bar .window-address{margin-left:16px;font-size:11px;color:#94a3b8;font-family:JetBrains Mono,monospace}.live-demo .demo-content{width:100%;height:480px;background:#fff;position:relative;display:flex;align-items:center;justify-content:center}.live-demo nine-board{display:block;width:100%!important;height:100%!important;position:absolute;top:0;left:0}.live-demo .sync-connector{display:flex;flex-direction:column;align-items:center;gap:12px}.live-demo .sync-connector .sync-line{width:60px;height:2px;background:repeating-linear-gradient(90deg,#F37021,#F37021 6px,transparent 6px,transparent 12px);animation:sync-flow 1s linear infinite}.live-demo .sync-connector .sync-badge{font-size:10px;font-weight:800;color:#f37021}@media(max-width:900px){.live-demo .dual-window-layout{flex-direction:column;gap:20px;margin-top:20px}.live-demo .demo-window{width:100%}.live-demo .window-bar{height:32px;padding:0 12px}.live-demo .window-bar .window-address{font-size:10px}.live-demo .demo-content{height:320px}.live-demo .sync-connector{transform:rotate(90deg);margin:15px 0}.live-demo .sync-connector .sync-line{width:40px}}.install .section-note{font-size:13px;color:#6e7681;margin-top:32px;border-left:3px solid #30363d;padding-left:16px;font-style:normal}.install .section-note strong{color:#f37021;font-weight:600}.example .note-box{margin-top:24px;padding:16px;border-radius:4px;font-size:13px;line-height:1.6;background:#161b22;color:#8b949e;border:1px solid #30363d}.example .note-box strong{color:#f37021;font-weight:600}.example .api-table th{padding:12px 16px;background:#fcfcfc;color:#888;font-weight:600;border-bottom:1px solid #eee}.example .api-table td{padding:16px;border-bottom:1px solid #f1f1f1;color:#666}.example .api-table td:first-child{font-weight:700;color:#111;background:#fcfcfc;border-right:1px solid #f1f1f1;width:140px}.example .api-table td code{font-family:JetBrains Mono,monospace;color:#f37021;font-weight:600}.live-demo .demo-container{margin-top:40px;border:1px solid #ddd;border-radius:12px;padding:24px;background:#fff;box-shadow:0 10px 30px #0000000d}.live-demo .dual-window-layout{display:flex;align-items:stretch;gap:24px;height:550px}.live-demo nine-editor{flex:1;display:block;width:100%;height:100%;overflow:hidden}.live-demo .control-panel{flex:1;display:flex;flex-direction:column;gap:20px}.live-demo .control-group{flex:1;display:flex;flex-direction:column;gap:10px}.live-demo textarea{flex:1;padding:12px;font-size:13px;line-height:1.5;font-family:JetBrains Mono,monospace;border:1px solid #ccc;border-radius:8px;resize:none;background:#fff}.live-demo .action-btn{padding:14px;cursor:pointer;font-size:14px;font-weight:600;border:none;border-radius:8px}@media(max-width:900px){.live-demo .dual-window-layout{flex-direction:column;height:auto}.live-demo nine-editor{width:100%;height:350px}.live-demo .control-group{height:250px}}.intro .feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:60px 80px;margin-bottom:80px}.intro .feature-item{padding-top:24px;border-top:1.5px solid #f1f1f1}.intro .feature-item h4{font-size:1.1rem;font-weight:700;color:#111;margin-bottom:12px}.intro .feature-item p{font-size:.95rem;color:#6b7280;line-height:1.6}@media(max-width:768px){.intro{padding-top:100px}.intro .feature-grid{grid-template-columns:1fr;gap:40px}}.install .install-methods-vertical{display:flex;flex-direction:column;gap:40px}.install .method-item{display:flex;flex-direction:column}.install .method-title{font-size:11px;font-weight:700;color:#f37021;text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px}.install .section-note{font-size:13px;color:#6e7681;margin-top:32px;border-left:3px solid #f1f1f1;padding-left:16px;font-style:normal}.install .section-note strong{color:#f37021}.example .usage-guide{display:flex;flex-direction:column}.example .api-reference{margin-top:60px}.example .api-reference .api-title{font-size:14px;font-weight:700;color:#111;margin-bottom:20px;text-transform:uppercase;letter-spacing:.05em}.example .api-table-wrapper{border-top:2px solid #111;overflow-x:auto}.example .api-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left}.example .api-table th{padding:12px 16px;background:#fcfcfc;color:#888;font-weight:600;border-bottom:1px solid #eee;white-space:nowrap}.example .api-table td{padding:14px 16px;border-bottom:1px solid #f1f1f1;color:#666;line-height:1.5;vertical-align:middle}.example .api-table td:first-child{font-weight:700;color:#111;background:#fcfcfc;border-right:1px solid #f1f1f1;width:120px}.example .api-table td code{--color: #F37021;font-family:JetBrains Mono,monospace;background:unset;padding:2px 4px;border-radius:3px;font-weight:600}.example .api-table tbody tr:hover td{background-color:#fafafa}.example .note-box{margin-top:20px;padding:12px 16px;border:1px solid #eee;border-radius:4px;font-size:.85rem;color:#666;line-height:1.6;background:#333;color:#ccc}.example .terminal-dot{width:10px;height:10px;background:#ddd;border-radius:50%}.example .code-content{color:#333}.example .code-content .comment{color:#999}.example .api-table code{background:none;padding:0;color:inherit}.features .specs-layout{border-top:1px solid #eee}.features .spec-row{display:flex;padding:32px 0;border-bottom:1px solid #f5f5f5}.features .spec-label{width:180px;flex-shrink:0;font-size:11px;font-weight:700;color:#f37021;text-transform:uppercase;letter-spacing:.1em;padding-top:4px}.features .spec-details{flex-grow:1;display:grid;grid-template-columns:1fr 1fr;gap:40px}.features .spec-item h4{font-size:1.1rem;font-weight:700;color:#111;margin-bottom:8px}.features .spec-item p{font-size:.9rem;color:#666;line-height:1.6;word-break:keep-all}@media(max-width:768px){.features{padding:80px 24px}.features .spec-row{flex-direction:column;gap:16px}.features .spec-details{grid-template-columns:1fr;gap:24px}.features .spec-label{width:auto;margin-bottom:8px}}.live-demo nine-query-result{margin-top:16px;height:600px}.guide-page-wrapper{background-color:#fff;color:#111;min-height:100vh}.intro,.features,.use-case,.install,.example,.contact,.live-demo{padding:100px 24px;max-width:940px;margin:0 auto;text-align:left;background-color:transparent}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .sub-title{display:block;font-size:11px;font-weight:700;color:green;letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .main-title{font-size:2rem;font-weight:800;color:#111;letter-spacing:-.04em;line-height:1.2;margin:0 0 32px}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .section-desc{font-size:1rem;color:#4b5563;line-height:1.7;margin-bottom:80px;word-break:keep-all;max-width:780px}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .section-desc strong{font-weight:700;color:#111}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .footer-line{width:40px;height:2px;background:#ccc;margin-top:64px}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .code-content{padding:20px;background:#0d1117;overflow-x:auto;margin:0}:is(.intro,.features,.use-case,.install,.example,.contact,.live-demo) .code-content code{display:block;color:#333;font-family:JetBrains Mono,Fira Code,monospace;font-size:13px;line-height:1.6;white-space:pre-wrap;word-break:break-all;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#999}
