:root{--bg:#fff;--bg-soft:#f7f7f5;--bg-sunken:#f1f1ef;--border:#e6e6e3;--border-strong:#d7d7d3;--text:#29292a;--text-soft:#6b6b6b;--text-faint:#9b9b9b;--accent:#2f6feb;--accent-soft:#e9f0ff;--danger:#d93a3a;--radius:8px;--shadow:0 8px 24px #0f0f0f1f;--sidebar-width:248px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-size:14px;line-height:1.5}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;color:inherit}.app-shell{height:100%;min-height:0;display:flex}.main{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex}.centered{place-items:center;height:100%;padding:24px;display:grid}.page-title{margin:0;font-size:15px;font-weight:600}.muted{color:var(--text-soft)}.small{font-size:12px}.error{color:var(--danger)}.row{align-items:center;display:flex}.row.gap{gap:8px}.spacer{flex:1}.btn{border:1px solid var(--border-strong);background:var(--bg);cursor:pointer;white-space:nowrap;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;display:inline-flex}.btn:hover{background:var(--bg-soft)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{filter:brightness(1.05)}.btn.ghost{color:var(--text-soft);background:0 0;border-color:#0000}.btn.ghost:hover{background:var(--bg-sunken);color:var(--text)}.btn.small{padding:3px 8px;font-size:12px}.icon-btn{width:24px;height:24px;color:var(--text-soft);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-btn:hover{background:var(--bg-sunken);color:var(--text)}.input,select.input,textarea.input{border:1px solid var(--border-strong);background:var(--bg);width:100%;font:inherit;color:inherit;border-radius:6px;padding:6px 8px}.input:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.field>span{color:var(--text-soft);font-size:12px}.pill{white-space:nowrap;border-radius:999px;align-items:center;padding:1px 8px;font-size:12px;line-height:18px;display:inline-flex}.pill-default{background:var(--bg-sunken);color:var(--text)}.pill-gray{color:#4a4a48;background:#e7e7e5}.pill-brown{color:#6b4438;background:#eee0da}.pill-orange{color:#8a4b21;background:#fbe4d5}.pill-yellow{color:#7a5a10;background:#fbf0d3}.pill-green{color:#2b593f;background:#dbeddb}.pill-blue{color:#28456c;background:#ddebf7}.pill-purple{color:#492f64;background:#e8deee}.pill-pink{color:#6f2c46;background:#f5e0e9}.pill-red{color:#8a2c1f;background:#ffe2dd}.pills{flex-wrap:wrap;gap:4px;display:inline-flex}.sidebar{width:var(--sidebar-width);flex:0 0 var(--sidebar-width);border-right:1px solid var(--border);background:var(--bg-soft);flex-direction:column;min-height:0;display:flex}.sidebar-head{align-items:center;gap:8px;padding:12px;display:flex}.brand{letter-spacing:-.01em;font-weight:700}.sidebar-section{color:var(--text-faint);padding:8px 12px;font-size:12px}.sidebar-list{flex:1;min-height:0;padding:0 8px 8px;overflow:auto}.sidebar-item{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;width:100%;padding:6px 8px;display:flex;overflow:hidden}.sidebar-item:hover{background:var(--bg-sunken)}.sidebar-item.active{background:var(--bg-sunken);font-weight:600}.sidebar-item .label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sidebar-foot{border-top:1px solid var(--border);padding:8px}.topbar{border-bottom:1px solid var(--border);align-items:center;gap:8px;min-height:52px;padding:10px 16px;display:flex}.db-icon{font-size:20px;line-height:1}.db-title{background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:18px;font-weight:700}.db-title:focus{outline:2px solid var(--accent-soft)}.viewbar{border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:6px 16px;display:flex;overflow-x:auto}.tab{color:var(--text-soft);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:4px 10px;display:inline-flex}.tab:hover{background:var(--bg-sunken)}.tab.active{background:var(--bg-sunken);border-color:var(--border);color:var(--text);font-weight:600}.grid-wrap{flex:1;min-height:0;padding:8px 16px 32px;overflow:auto}.grid{border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:100%}.grid th,.grid td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;background:var(--bg);padding:0}.grid thead th{z-index:2;background:var(--bg-soft);height:34px;color:var(--text-soft);font-size:12px;font-weight:500;position:sticky;top:0}.grid th.row-head,.grid td.row-head{text-align:center;width:44px;min-width:44px;color:var(--text-faint);background:var(--bg-soft);z-index:1;font-size:12px;position:sticky;left:0}.grid thead th.row-head{z-index:3}.grid tr:hover td{background:#fbfbfa}.grid tr.selected td{background:var(--accent-soft)}.grid td.cell{padding:0 2px}.grid thead th .head{align-items:center;gap:4px;height:33px;padding:0 4px 0 8px;display:flex}.grid thead th .head .name{text-overflow:ellipsis;white-space:nowrap;cursor:pointer;flex:1;overflow:hidden}.resizer{cursor:col-resize;flex:0 0 5px;align-self:stretch;width:5px}.resizer:hover{background:var(--accent);opacity:.5}.row-height-short td.cell-view-cell{height:33px}.row-height-medium td.cell-view-cell{height:44px}.row-height-tall td.cell-view-cell{height:72px}.cell-view{cursor:text;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;align-items:center;gap:4px;width:100%;min-height:32px;padding:2px 6px;display:flex;overflow:hidden}.cell-view:disabled{cursor:default;color:var(--text)}.cell-static{white-space:nowrap;text-overflow:ellipsis;align-items:center;min-height:32px;padding:2px 6px;display:inline-flex;overflow:hidden}.cell-input{border:2px solid var(--accent);background:var(--bg);width:100%;font:inherit;color:inherit;border-radius:4px;padding:5px 6px}.cell-dropdown{border:2px solid var(--accent);background:var(--bg);box-shadow:var(--shadow);border-radius:6px;outline:none;flex-direction:column;gap:2px;max-height:240px;padding:6px;display:flex;position:relative;overflow:auto}.cell-option{cursor:pointer;border-radius:4px;align-items:center;gap:6px;padding:2px 4px;display:flex}.cell-option:hover{background:var(--bg-sunken)}.cell-date{align-items:center;gap:4px;padding:2px;display:flex}.cell-date .cell-input{width:auto}.checkbox{border:1px solid var(--border-strong);color:#fff;border-radius:3px;justify-content:center;align-items:center;width:16px;height:16px;font-size:11px;display:inline-flex}.checkbox.on{background:var(--accent);border-color:var(--accent)}.file-list{gap:6px;display:inline-flex;overflow:hidden}.file-chip{border:1px solid var(--border);background:var(--bg-soft);white-space:nowrap;text-overflow:ellipsis;border-radius:4px;align-items:center;gap:4px;max-width:220px;padding:1px 6px;display:inline-flex;overflow:hidden}.add-col{width:130px;min-width:130px;color:var(--text-faint);cursor:pointer}.grid-toolbar{align-items:center;gap:8px;padding:0 0 8px;display:flex}.row-menu{z-index:20;border:1px solid var(--border);background:var(--bg);min-width:168px;box-shadow:var(--shadow);border-radius:8px;padding:4px;position:absolute}.menu-item{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;width:100%;padding:6px 8px;display:flex}.menu-item:hover{background:var(--bg-sunken)}.menu-item.danger{color:var(--danger)}.menu-label{color:var(--text-faint);padding:6px 8px 2px;font-size:11px}.popover{z-index:30;border:1px solid var(--border);background:var(--bg);width:320px;max-height:70vh;box-shadow:var(--shadow);border-radius:10px;padding:12px;position:absolute;top:calc(100% + 6px);right:0;overflow:auto}.popover.wide{width:420px}.popover-host{position:relative}.filter-row{align-items:center;gap:4px;margin-bottom:6px;display:flex}.filter-row select{max-width:110px}.board{flex:1;align-items:flex-start;gap:12px;min-height:0;padding:8px 16px 32px;display:flex;overflow:auto}.board-column{background:var(--bg-soft);border-radius:10px;flex-direction:column;flex:0 0 272px;gap:8px;max-height:100%;padding:8px;display:flex}.board-column-head{color:var(--text-soft);align-items:center;gap:6px;font-size:12px;display:flex}.card{border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:8px;flex-direction:column;gap:6px;padding:10px;display:flex;box-shadow:0 1px 2px #0f0f0f0f}.card:hover{border-color:var(--border-strong)}.card-title{word-break:break-word;font-weight:600}.card-meta{color:var(--text-soft);flex-wrap:wrap;gap:4px;font-size:12px;display:flex}.gallery{flex:1;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));align-content:start;gap:12px;min-height:0;padding:8px 16px 32px;display:grid;overflow:auto}.gallery-card{border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:10px;flex-direction:column;gap:6px;padding:12px;display:flex}.gallery-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow)}.gallery-preview{background:var(--bg-sunken);height:96px;color:var(--text-faint);border-radius:6px;place-items:center;font-size:12px;display:grid;overflow:hidden}.modal-backdrop{z-index:40;background:#0f0f0f52;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal{background:var(--bg);width:100%;max-width:520px;max-height:86vh;box-shadow:var(--shadow);border-radius:12px;padding:16px;overflow:auto}.modal.wide{max-width:660px}.modal-head{align-items:center;gap:8px;margin-bottom:12px;display:flex}.modal-head h3{flex:1;margin:0;font-size:15px}.auth-card{border:1px solid var(--border);background:var(--bg);width:100%;max-width:380px;box-shadow:var(--shadow);border-radius:14px;padding:24px}.auth-card h1{margin:0 0 4px;font-size:22px}.auth-card p.muted{margin:0 0 16px}.center-list{flex-direction:column;gap:8px;display:flex}.list-row{border:1px solid var(--border);border-radius:8px;align-items:center;gap:8px;padding:8px;display:flex}.code{background:var(--bg-sunken);word-break:break-all;border-radius:4px;padding:2px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.toast{z-index:60;color:#fff;box-shadow:var(--shadow);background:#29292a;border-radius:999px;padding:8px 14px;font-size:13px;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.empty-state{text-align:center;color:var(--text-soft);padding:48px 16px}.workspace,.view-body{flex-direction:column;flex:1;min-height:0;display:flex}.icon-input{text-align:center;background:0 0;border:1px solid #0000;border-radius:6px;width:42px;padding:2px 4px;font-size:20px;line-height:1.2}.icon-input:focus{border-color:var(--border-strong);outline:none}.icon-input.readonly{cursor:default;border-color:#0000}.title-input{background:0 0;border:1px solid #0000;border-radius:6px;min-width:180px;padding:2px 6px;font-size:18px;font-weight:700}.title-input:hover:not(:disabled){border-color:var(--border)}.title-input:focus{border-color:var(--accent);background:var(--bg);outline:none}.title-static{padding:2px 6px;font-size:18px;font-weight:700}.badge{border:1px solid var(--border);background:var(--bg-sunken);color:var(--text-soft);white-space:nowrap;border-radius:999px;align-items:center;padding:1px 8px;font-size:12px;display:inline-flex}.badge.role-owner{color:#8a5a00;background:#fff5dc;border-color:#f0dca6}.badge.role-editor{background:var(--accent-soft);color:#17509a;border-color:#c9dcff}.badge.role-viewer{color:var(--text-soft)}.public-page{flex-direction:column;height:100%;min-height:0;display:flex}.share-desc{margin:8px 16px 0}.link{color:var(--accent);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.gallery-wrap{flex-direction:column;flex:1;min-height:0;display:flex;overflow:auto}.gallery-body{cursor:pointer;flex-direction:column;gap:4px;display:flex}.gallery-add{border:1px dashed var(--border-strong);min-height:120px;color:var(--text-soft);cursor:pointer;background:0 0;border-radius:10px;place-items:center;display:grid}.gallery-add:hover{background:var(--bg-soft);color:var(--text)}.form-section{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding:12px 0;display:flex}.toasts{z-index:60;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.toasts .toast{position:static;transform:none}.toast.error{background:var(--danger)}