*{box-sizing:border-box}body{margin:0;font-family:Inter,-apple-system,PingFang SC,Helvetica Neue,sans-serif;color:#1f2933;background:#f4f5f8}a{color:#7c3aed;text-decoration:none}button{font:inherit;cursor:pointer;border:1px solid #cbd2d9;background:#fff;border-radius:6px;padding:6px 14px}button.primary{background:#7c3aed;border-color:#7c3aed;color:#fff}button.primary:hover{background:#6d28d9;border-color:#6d28d9}button:disabled{opacity:.45;cursor:default}code{font-family:ui-monospace,monospace}.app-shell{display:flex;min-height:100vh}.sidebar{width:230px;flex:none;background:#fff;border-right:1px solid #e4e7eb;padding:16px 12px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}.workspace{display:flex;align-items:center;gap:10px;padding:6px 10px 14px;font-weight:600;font-size:15px}.avatar{width:28px;height:28px;border-radius:50%;background:#7c3aed;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600}.create-new{color:#7c3aed;background:none;border:none;text-align:left;padding:8px 10px;font-weight:600;border-radius:8px;width:100%}.create-new:hover{background:#f5f3ff}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:#1f2933;font-size:14px}.nav-item svg{flex:none}.nav-item:hover{background:#f4f5f8}.nav-item.active{background:#ede9fe;color:#6d28d9;font-weight:600}.main{flex:1;padding:24px 32px;min-width:0}.main h1.page-title{font-size:20px;margin:0 0 16px;display:flex;align-items:baseline;gap:16px}.sort-hint{color:#7b8794;font-size:13px;font-weight:400}.create-row{margin-bottom:16px}.create-row .create-card{width:220px}.board-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.create-card{background:#7c3aed;color:#fff;border:none;border-radius:10px;height:148px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding:16px;font-weight:600;font-size:15px}.create-card:hover{background:#6d28d9}.file-card{background:#fff;border:1px solid #e4e7eb;border-radius:10px;overflow:hidden;position:relative;transition:box-shadow .15s,transform .15s;cursor:pointer}.file-card:hover{box-shadow:0 1px 3px #10182814,0 8px 16px #1018280f;transform:translateY(-2px)}.file-card .thumb{height:100px;background:#f5f3ff;display:flex;align-items:center;justify-content:center;color:#7c3aed}.file-card .body{padding:10px 12px}.file-card .title{font-weight:600;font-size:14px;color:#1f2933;display:block}.file-card .meta{color:#7b8794;font-size:12px;margin-top:4px;display:block}.card-menu-btn{position:absolute;top:8px;right:8px;width:28px;height:28px;padding:0;border-radius:6px;border:1px solid #e4e7eb;background:#fff;opacity:0;display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:#7b8794;box-shadow:0 1px 3px #10182814}.file-card:hover .card-menu-btn{opacity:1}.card-menu-btn:hover{color:#1f2933}.card-rename-input{font:inherit;font-weight:600;font-size:14px;width:100%;border:1.5px solid #7c3aed;border-radius:6px;padding:2px 6px;outline:none}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f121e66;z-index:200;display:flex;align-items:center;justify-content:center}.modal-card{background:#fff;border-radius:12px;padding:20px 24px;width:360px;box-shadow:0 8px 32px #10182833}.modal-card h3{margin:0 0 8px;font-size:16px}.modal-card p{margin:0 0 16px;color:#7b8794;font-size:14px}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.modal-card button.danger{background:#dc2626;border-color:#dc2626;color:#fff}.modal-card button.danger:hover{background:#b91c1c;border-color:#b91c1c}@keyframes ctx-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.ctx-menu{position:fixed;z-index:300;background:#fff;border-radius:10px;border:1px solid #e4e7eb;box-shadow:0 8px 24px #10182824;padding:6px;min-width:190px;font-size:13px;animation:ctx-in .1s ease-out}.ctx-item{display:flex;align-items:center;gap:8px;height:34px;padding:0 10px;border-radius:6px;font-size:13px;background:none;border:none;width:100%;text-align:left;color:#1f2933}.ctx-item svg{flex:none;color:#7b8794}.ctx-item:hover{background:#f3f4f6}.ctx-item:hover svg{color:#1f2933}.ctx-item.danger{color:#dc2626;background:none}.ctx-item.danger svg{color:#dc2626}.ctx-item.danger:hover{background:#fef2f2;color:#dc2626}.ctx-item .shortcut{margin-left:auto;color:#7b8794;font-size:12px}.ctx-sep{height:1px;background:#eef0f3;margin:5px 6px}.floating-input{position:fixed;z-index:300;background:#fff;border:1.5px solid #7c3aed;border-radius:6px;padding:6px 10px;font-size:13px;outline:none;box-shadow:0 4px 16px #1018281f;min-width:160px}.connect-pop{position:fixed;z-index:300;background:#fff;border:1px solid #e4e7eb;border-radius:10px;box-shadow:0 4px 16px #1018281f;padding:12px;display:flex;flex-direction:column;gap:8px;width:220px}.connect-pop input{font:inherit;font-size:13px;border:1.5px solid #7c3aed;border-radius:6px;padding:6px 10px;outline:none}.dir-toggle{display:flex;border:1px solid #e4e7eb;border-radius:6px;overflow:hidden}.dir-toggle button{flex:1;padding:6px 0;border:none;background:#fff;font-size:13px;color:#7b8794}.dir-toggle button.on{background:#ede9fe;color:#6d28d9;font-weight:600}.center{display:flex;flex-direction:column;align-items:center;gap:16px;padding-top:140px}.center h1{color:#7c3aed;font-size:32px;margin:0}.center p{color:#7b8794;margin:0}.card-list{display:grid;gap:12px}.card{border:1px solid #e4e7eb;border-radius:10px;padding:16px;display:flex;align-items:center;background:#fff;box-shadow:0 1px 3px #10182814}.card .title{flex:1;font-weight:600}.card .meta{color:#7b8794;font-size:13px;margin-left:12px}.token-box{font-family:ui-monospace,monospace;background:#f5f3ff;border:1px solid #ede9fe;border-radius:8px;padding:12px;word-break:break-all;color:#6d28d9}.tokens-panel{display:flex;flex-direction:column;gap:16px}.tokens-create{display:flex;gap:8px}.tokens-create input{flex:1;font:inherit;font-size:14px;border:1px solid #cbd2d9;border-radius:6px;padding:6px 12px;outline:none}.tokens-create input:focus{border-color:#7c3aed}.tokens-fresh{display:block}.tokens-fresh p{margin:0 0 8px;color:#7b8794;font-size:13px}.tokens-fresh-actions{display:flex;gap:8px;margin:10px 0 14px}.tokens-hint{color:#7b8794;font-size:13px;margin:0}.token-config{font-family:ui-monospace,monospace;font-size:12px;background:#f5f3ff;border:1px solid #ede9fe;border-radius:8px;padding:12px;overflow-x:auto;color:#6d28d9;margin:8px 0 0;white-space:pre}.tokens-modal{width:560px;max-height:80vh;overflow-y:auto}.tokens-modal h3{margin-bottom:16px}.editor-wrap{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#fff}.editor-toolbar{display:flex;align-items:center;gap:12px;padding:8px 16px;border-bottom:1px solid #e4e7eb;background:#fff;z-index:5;flex:none}.editor-back{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;color:#1f2933;font-size:16px}.editor-back:hover{background:#f4f5f8}.editor-toolbar .crumb{font-weight:600;font-size:14px;cursor:text;padding:4px 8px;border-radius:6px}.editor-toolbar .crumb:hover{background:#f4f5f8}.editor-title-input{font:inherit;font-weight:600;font-size:14px;border:1.5px solid #7c3aed;border-radius:6px;padding:2px 8px;outline:none}.editor-toolbar .spacer{flex:1}.save-status{font-size:12px;color:#7b8794}.save-status.st-saved{color:#059669}.save-status.st-saving,.save-status.st-retrying{color:#b45309}.save-status.st-offline,.save-status.st-rejected{color:#dc2626}.save-notice{font-size:12px;color:#6d28d9;background:#f5f3ff;border:1px solid #ede9fe;border-radius:999px;padding:2px 10px}.editor-body{flex:1;display:flex;min-height:0}.editor-left{min-width:0;border-right:none;overflow:hidden}.code-editor-host,.code-editor-host .cm-editor{height:100%}.editor-divider{width:5px;cursor:col-resize;flex:none;background:#e4e7eb;transition:background .12s}.editor-divider:hover,.editor-divider:active{background:#7c3aed}.editor-right{flex:1;min-width:0;display:flex;flex-direction:column;background:#fafafa}.preview-pane{display:flex;flex-direction:column;height:100%}.preview-toolbar{display:flex;align-items:center;gap:4px;padding:6px 12px;border-bottom:1px solid #e4e7eb;background:#fff;flex:none}.preview-toolbar button{border:none;padding:4px 10px;font-size:13px;border-radius:6px}.preview-toolbar button:hover{background:#f4f5f8}.preview-toolbar .zoom{color:#7b8794;font-size:12px;min-width:44px;text-align:center}.preview-canvas{flex:1;overflow:hidden;position:relative;cursor:grab}.preview-canvas.dragging,.preview-canvas:active{cursor:grabbing}.preview-stage{position:absolute;top:24px;left:24px;transform-origin:0 0}.preview-stage svg{max-width:none}.preview-error{margin:16px;padding:12px 16px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#b91c1c;font-size:12px;white-space:pre-wrap;font-family:ui-monospace,monospace;cursor:default}.error-panel{flex:none;border-top:1px solid #e4e7eb;background:#fff}.error-panel-bar{display:flex;align-items:center;width:100%;gap:8px;padding:7px 16px;border:none;background:none;font-size:13px;text-align:left}.error-count{color:#dc2626;font-weight:600}.error-ok{color:#059669}.error-toggle{margin-left:auto;color:#7b8794;font-size:12px}.error-list{max-height:180px;overflow-y:auto;border-top:1px solid #f0f1f4;padding:4px 0}.error-row{display:flex;align-items:baseline;gap:10px;width:100%;padding:5px 16px;border:none;background:none;font-size:13px;text-align:left;font-family:inherit}.error-row:hover{background:#fef2f2}.error-pos{color:#dc2626;font-family:ui-monospace,monospace;font-size:12px;flex:none;min-width:44px}.error-code{color:#b45309;font-family:ui-monospace,monospace;font-size:11px;flex:none}.error-msg{color:#1f2933}.error-sug{color:#6d28d9;font-size:12px}.type-badge{display:inline-block;margin-right:6px;padding:0 6px;border-radius:4px;background:#ede9fe;color:#6d28d9;font-size:11px;line-height:18px;vertical-align:1px}.error-lenient-hint{padding:8px 14px;color:#92400e;background:#fffbeb;border-top:1px solid #fde68a;font-size:12.5px}.template-section{margin-bottom:18px}.template-group-label{font-size:12px;color:#7b8794;margin:10px 0 6px}.template-grid{display:flex;flex-wrap:wrap;gap:8px}.template-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border:none;border-radius:8px;font-size:12.5px;font-weight:500;line-height:1;white-space:nowrap;cursor:pointer}.template-btn:hover{filter:brightness(.95)}.template-btn:active{transform:translateY(1px)}
