/* UnifiedSpread package base CSS.
 * Host contract: every package-owned rule is scoped by .uspread so Host topbar,
 * tabs, common menus and other package CSS are not affected.
 */
.uspread{
  --uspread-bg:#f5f6f8;
  --uspread-surface:#fff;
  --uspread-surface2:#fafbfc;
  --uspread-border:#d9dee7;
  --uspread-border2:#e7ebf0;
  --uspread-text:#1f2937;
  --uspread-muted:#667085;
  --uspread-primary:#2563eb;
  --uspread-primary-soft:#eff6ff;
  --uspread-hover:#f3f4f6;
  --uspread-disabled:#f8fafc;
  --uspread-disabled-text:#98a2b3;
  --uspread-shadow:0 1px 2px rgba(16,24,40,.05);
  --uspread-toolbar-height:42px;
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  color:var(--uspread-text);
  background:var(--uspread-bg);
  font-family:Arial,sans-serif;
  font-size:14px;
  box-sizing:border-box;
}
.uspread *{box-sizing:border-box}
.uspread[data-theme="dark"],
.uspread #app.theme-dark{
  --uspread-bg:#111827;
  --uspread-surface:#1f2937;
  --uspread-surface2:#111827;
  --uspread-border:#374151;
  --uspread-border2:#2b3545;
  --uspread-text:#e5e7eb;
  --uspread-muted:#9ca3af;
  --uspread-primary:#60a5fa;
  --uspread-primary-soft:#172554;
  --uspread-hover:#243041;
  --uspread-disabled:#1b2430;
  --uspread-disabled-text:#667085;
  --uspread-shadow:none;
}
.uspread #app{height:100%;min-height:0;width:100%;display:flex;flex-direction:column;color:var(--uspread-text);background:var(--uspread-bg)}
.uspread #topBar{flex:0 0 auto;background:var(--uspread-surface);border-bottom:1px solid var(--uspread-border);box-shadow:var(--uspread-shadow)}
.uspread .topbar-title-row{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:14px;padding:10px 14px;border-bottom:1px solid var(--uspread-border2)}
.uspread .topbar-brand{font-size:18px;font-weight:700;display:flex;align-items:flex-start;padding-top:2px}
.uspread .topbar-center{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.uspread .file-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:640px}
.uspread .save-state{display:none}
.uspread .topbar-actions{display:flex;gap:8px;align-self:start}
.uspread .menu-bar{display:flex;align-items:center;gap:4px;position:relative;z-index:1200;white-space:nowrap}
.uspread .topbar-toolbar-row{display:block}
.uspread #menuBar{display:flex;align-items:center;gap:4px;min-height:38px;position:relative;z-index:1200}
.uspread .menu-item{position:relative;display:inline-flex}
.uspread .menu-trigger{height:30px;padding:0 10px;border:0;background:transparent;color:var(--uspread-text);border-radius:6px;cursor:pointer}
.uspread .menu-trigger:hover,.uspread .menu-trigger.is-open{background:var(--uspread-hover)}
.uspread .menu-panel{display:none;position:absolute;top:34px;left:0;min-width:270px;background:var(--uspread-surface);border:1px solid var(--uspread-border);border-radius:10px;box-shadow:0 8px 24px rgba(16,24,40,.12);padding:6px;z-index:2000}
.uspread .menu-item.open>.menu-panel{display:block}
.uspread .menu-action,.uspread .menu-subtrigger{display:flex;align-items:center;gap:8px;width:100%;min-height:34px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:var(--uspread-text);text-align:left;cursor:pointer}
.uspread .menu-action:hover,.uspread .menu-subtrigger:hover,.uspread .menu-subtrigger.is-open{background:var(--uspread-hover)}
.uspread .menu-action.disabled,.uspread .menu-subtrigger.disabled{color:var(--uspread-disabled-text);cursor:default}
.uspread .menu-icon{width:16px;text-align:center}.uspread .menu-text{flex:1}.uspread .menu-badge{font-size:11px;color:var(--uspread-muted)}
.uspread .menu-sep{height:1px;margin:6px 0;background:var(--uspread-border2)}
.uspread .menu-sub{position:relative}
.uspread .menu-subpanel{display:none;position:absolute;top:-6px;left:calc(100% - 4px);min-width:240px;background:var(--uspread-surface);border:1px solid var(--uspread-border);border-radius:10px;box-shadow:0 8px 24px rgba(16,24,40,.12);padding:6px;z-index:2100}
.uspread .menu-sub.open>.menu-subpanel{display:block}
.uspread .toolbar{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px solid var(--uspread-border2);min-height:var(--uspread-toolbar-height);overflow-x:auto;background:var(--uspread-surface)}
.uspread .toolbar-group{display:flex;align-items:center;gap:6px;flex-wrap:nowrap}.uspread .toolbar-sep{width:1px;height:24px;background:var(--uspread-border);flex:0 0 auto}
.uspread .btn,.uspread .toolbar-btn,.uspread .icon-btn,.uspread .toolbar-select{height:30px;border:1px solid var(--uspread-border);background:var(--uspread-surface);color:var(--uspread-text);border-radius:8px;cursor:pointer}
.uspread .toolbar-btn,.uspread .icon-btn{width:34px;min-width:34px;padding:0;display:inline-flex;align-items:center;justify-content:center}.uspread .toolbar-select{padding:0 10px;min-width:82px}
.uspread .toolbar-btn:hover,.uspread .icon-btn:hover,.uspread .btn:hover,.uspread .toolbar-select:hover{background:var(--uspread-hover)}
.uspread .toolbar-btn.disabled,.uspread .toolbar-select.disabled{background:var(--uspread-disabled);color:var(--uspread-disabled-text);cursor:default}
.uspread .toolbar-btn.is-primary,.uspread .btn-primary{border-color:var(--uspread-primary);background:var(--uspread-primary-soft);color:var(--uspread-primary)}
.uspread #contentShell{flex:1;min-height:0;display:flex}.uspread .side-area{width:240px;border-right:1px solid var(--uspread-border2);background:var(--uspread-surface2)}
.uspread .side-area.hidden{display:none}.uspread #rightSideArea{border-right:0;border-left:1px solid var(--uspread-border2)}.uspread #mainContentArea{flex:1;min-width:0;display:flex;flex-direction:column}
.uspread #workspaceShell{flex:1;min-height:0;background:var(--uspread-bg);overflow:hidden}.uspread #workspace{height:100%;min-height:420px;background:var(--uspread-surface)}
.uspread #statusBar{display:flex;align-items:center;justify-content:space-between;min-height:32px;padding:0 12px;background:var(--uspread-surface);border-top:1px solid var(--uspread-border);color:var(--uspread-muted);font-size:12px}.uspread #statusBar .status-right{display:flex;align-items:center;gap:12px}
.uspread .modal{position:fixed;inset:0;z-index:2000}.uspread .modal.hidden{display:none}.uspread .modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.32)}
.uspread .modal-panel{position:relative;width:min(520px,calc(100vw - 32px));margin:72px auto 0;background:var(--uspread-surface);border:1px solid var(--uspread-border);border-radius:14px;box-shadow:0 20px 48px rgba(15,23,42,.20);overflow:hidden}.uspread .modal-panel-sm{width:min(420px,calc(100vw - 32px))}
.uspread .modal-header,.uspread .modal-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--uspread-surface)}.uspread .modal-header{border-bottom:1px solid var(--uspread-border2)}.uspread .modal-footer{border-top:1px solid var(--uspread-border2);justify-content:flex-end;gap:8px}
.uspread .modal-title{font-size:15px;font-weight:700}.uspread .modal-close{width:30px;height:30px;border:0;background:transparent;color:var(--uspread-muted);font-size:18px;cursor:pointer;border-radius:8px}.uspread .modal-close:hover{background:var(--uspread-hover)}
.uspread .modal-body{padding:14px}.uspread .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.uspread .field-label{color:var(--uspread-muted);font-size:12px}.uspread .field select{height:32px;padding:0 10px;border:1px solid var(--uspread-border);border-radius:8px;background:var(--uspread-surface);color:var(--uspread-text)}.uspread .checkbox-field{flex-direction:row;align-items:center;gap:8px}
.uspread.unifiedspread-host-frame{height:100%;min-height:0;display:flex;flex-direction:column;background:var(--uspread-bg)}
.uspread.unifiedspread-host-frame>#app{height:100%;min-height:0;width:100%}
.uspread .unifiedspread-app-shell{overflow:hidden}
.uspread .toolbar-btn.is-active{background:var(--uspread-primary-soft);border-color:var(--uspread-primary);color:var(--uspread-primary)}
.uspread .toolbar-select-wrap{display:inline-flex;align-items:center}.uspread .toolbar-color{width:34px;height:30px;border:1px solid var(--uspread-border);border-radius:8px;background:var(--uspread-surface);display:inline-flex;align-items:center;justify-content:center;overflow:hidden}.uspread .toolbar-color input{width:34px;height:30px;border:0;padding:0;background:transparent;cursor:pointer}
@media (max-width:960px){.uspread .topbar-title-row{grid-template-columns:auto 1fr}.uspread .topbar-actions{grid-column:2/3;justify-self:end}.uspread .file-name{max-width:360px}}