/* Modern app shell — CSS Grid, XP-style chrome */

.sco-app-shell {
  display: flex;
  flex-direction: column;
  height: 100vh;
  min-height: 480px;
  overflow: hidden;
}

.sco-titlebar,
.sco-menubar,
.sco-toolbar-wrap,
.sco-statusbar,
.sco-ad-banner,
.sco-banner-dev {
  flex-shrink: 0;
}

.sco-titlebar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  background: var(--sco-xp-title);
  color: #fff;
  font-size: 12px;
  font-weight: bold;
}

.sco-titlebar img { vertical-align: middle; }

.sco-titlebar .brand {
  margin-left: auto;
  font-weight: normal;
  opacity: 0.9;
}

.sco-menubar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  min-height: var(--sco-menu-h);
  padding: 0 4px;
  background: var(--sco-xp-menu);
  border-bottom: 1px solid var(--sco-xp-border);
  font-size: 11px;
}

.sco-menubar details {
  position: relative;
}

.sco-menubar summary {
  list-style: none;
  cursor: pointer;
  padding: 4px 10px;
  user-select: none;
}

.sco-menubar summary::-webkit-details-marker { display: none; }

.sco-menubar details[open] summary {
  background: var(--sco-xp-highlight);
  color: #fff;
}

.sco-menu-panel {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 100;
  min-width: 180px;
  background: #fff;
  border: 1px solid var(--sco-xp-border);
  box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
  padding: 2px 0;
}

.sco-menu-panel button,
.sco-menu-panel a {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: none;
  font: inherit;
  padding: 4px 24px;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.sco-menu-panel button:hover,
.sco-menu-panel a:hover {
  background: var(--sco-xp-highlight);
  color: #fff;
}

.sco-menu-panel hr {
  border: none;
  border-top: 1px solid #ccc;
  margin: 4px 0;
}

.sco-menubar .nav-link {
  margin-left: auto;
  padding: 4px 10px;
  color: #004488;
  text-decoration: none;
}

.sco-toolbar-wrap {
  background: #ebebeb;
  border-bottom: 1px solid #b0b0b0;
}

.sco-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  min-height: 26px;
  padding: 3px 4px;
  background: #ebebeb;
  font-size: 11px;
}

.sco-toolbar-2 {
  border-top: 1px solid #d0d0d0;
  padding-top: 2px;
  position: relative;
}

.sco-toolbar-2 .sco-tb-select {
  float: right;
}

.sco-tb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 3px;
  margin: 0 2px 0 0;
  border: 1px solid #a8a8a8;
  background: #ebebeb;
  cursor: pointer;
  vertical-align: middle;
  font: inherit;
  line-height: 1;
}

.sco-tb img {
  display: block;
  width: 16px;
  height: 16px;
  border: 0;
  background: transparent;
}

.sco-tb:hover {
  border-color: #18a558;
  background: #e5f3e8;
}

.sco-tb:active {
  border-color: #808080;
  background: #d4d0c8;
}

.sco-tb-text {
  width: auto;
  min-width: 16px;
  height: 24px;
  padding: 3px 5px;
  font-size: 10px;
  line-height: 16px;
  font-family: Tahoma, Arial, sans-serif;
  color: #222;
}

.sco-tb-select {
  font-size: 11px;
  vertical-align: middle;
  margin: 0 2px;
  max-width: 140px;
}

.sco-toolbar .sep {
  width: 1px;
  height: 20px;
  background: #b0b0b0;
  margin: 0 4px;
  flex-shrink: 0;
}

body.view-hide-toolbar .sco-toolbar-wrap {
  display: none;
}

.sco-work {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  background: #fff;
}

.sco-editor {
  min-height: 100%;
  box-sizing: border-box;
  padding: 24px 32px;
  outline: none;
}

.sco-editor:focus {
  outline: none;
}

.sco-statusbar {
  display: flex;
  align-items: center;
  padding: 0 8px;
  background: var(--sco-xp-menu);
  border-top: 1px solid #fff;
  font-size: 11px;
  color: var(--sco-xp-muted);
}

.sco-ad-banner iframe {
  display: block;
  width: 100%;
  height: var(--sco-ad-h);
  border: none;
}

.sco-banner-dev {
  background: #fff3cd;
  border-bottom: 1px solid #e0c060;
  padding: 6px 10px;
  font-size: 11px;
}

.sco-banner-dev a { color: #004488; font-weight: bold; }

/* Modal dialogs */
.sco-dialog-mask {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 9000;
}

.sco-dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9001;
  min-width: 320px;
  max-width: 90vw;
  background: #fff;
  border: 1px solid var(--sco-xp-border);
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.25);
  font-size: 11px;
}

.sco-dialog-title {
  background: var(--sco-xp-title);
  color: #fff;
  padding: 6px 10px;
  font-weight: bold;
}

.sco-dialog-body {
  padding: 12px 14px;
  max-height: 60vh;
  overflow: auto;
}

.sco-dialog-foot {
  padding: 8px 14px 12px;
  text-align: right;
  border-top: 1px solid #ddd;
}

.sco-dialog-btn {
  margin-left: 6px;
  padding: 4px 14px;
  font: inherit;
  cursor: pointer;
}

.sco-dialog-btn.primary {
  font-weight: bold;
}

.sco-form label {
  display: block;
  margin-bottom: 10px;
}

.sco-form-hint {
  margin: 0 0 8px;
  font-size: 11px;
  color: #555;
}

.sco-cloud-list {
  max-height: 280px;
  overflow: auto;
  border: 1px solid #ccc;
}

.sco-cloud-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.sco-cloud-table th,
.sco-cloud-table td {
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  text-align: left;
}

.sco-cloud-table th {
  background: #f5f5f5;
  position: sticky;
  top: 0;
}

.sco-req {
  color: #c62828;
  font-weight: bold;
}

.scoClipartAccess {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #ddd;
  font-size: 11px;
}

.scoClipartAccess .scoClipartField:last-child {
  margin-bottom: 0;
}

.scoClipartUrl {
  font-size: 11px;
  margin-top: 4px;
}

.scoClipartUrl .scoClipartField {
  margin-bottom: 0;
}

.sco-input-wide {
  width: 100%;
  max-width: 280px;
  margin-top: 4px;
  font: inherit;
  padding: 3px 6px;
}

.sco-fieldset {
  margin-top: 12px;
  border: 1px solid #ccc;
  padding: 8px 10px;
}

.sco-fieldset label {
  display: block;
  margin-bottom: 4px;
}

.sco-form-muted {
  margin: 6px 0 0;
  font-size: 10px;
  color: #666;
}

.sco-plain-file {
  font-family: var(--sco-font-mono, monospace);
  white-space: pre-wrap;
  margin: 0;
}

/* Calc grid placeholder */
.sco-formula-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  background: #ece9d8;
  border-bottom: 1px solid var(--sco-xp-border);
  flex-shrink: 0;
}

.sco-calc-work {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.sco-calc-scroll {
  overflow: auto;
  flex: 1;
  min-height: 0;
}

.sco-cell-ref {
  min-width: 48px;
  font-weight: bold;
  font-size: 11px;
}

.sco-formula-input {
  flex: 1;
  font: 12px Tahoma, sans-serif;
  padding: 3px 6px;
  border: 1px solid #808080;
}

.sco-calc-grid {
  border-collapse: collapse;
  font-size: 11px;
}

.sco-calc-grid th,
.sco-calc-grid td {
  border: 1px solid #bbb;
  min-width: 72px;
  height: 22px;
  padding: 0;
}

.sco-calc-grid th {
  background: #ece9d8;
  text-align: center;
  font-weight: normal;
  padding: 2px 6px;
}

.sco-calc-grid.no-gridlines th,
.sco-calc-grid.no-gridlines td {
  border-color: transparent;
}

.sco-calc-grid input {
  width: 72px;
  box-sizing: border-box;
  border: none;
  padding: 2px 4px;
  font: inherit;
}

.sco-calc-grid input:focus {
  outline: 2px solid var(--sco-xp-highlight);
  outline-offset: -2px;
}

/* Impress */
.sco-impress-layout {
  display: grid;
  grid-template-columns: 140px 1fr;
  height: 100%;
  min-height: 0;
}

.sco-slide-list {
  background: #ece9d8;
  border-right: 1px solid var(--sco-xp-border);
  overflow: auto;
  padding: 4px;
}

.sco-slide-thumb {
  display: block;
  width: 100%;
  margin-bottom: 4px;
  padding: 4px;
  border: 1px solid #808080;
  background: #fff;
  cursor: pointer;
  font-size: 10px;
  text-align: left;
}

.sco-slide-thumb.active {
  border-color: var(--sco-xp-highlight);
  background: #dfe8f6;
}

.sco-slide-stage {
  padding: 16px;
  background: #666;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sco-slide-canvas {
  width: min(720px, 100%);
  aspect-ratio: 16 / 9;
  background: #fff;
  border: 1px solid #222;
  padding: 24px;
  overflow: auto;
}

/* myPage */
.sco-mypage-layout {
  display: grid;
  grid-template-columns: var(--sco-sidebar-w) 1fr;
  height: 100%;
  min-height: 0;
}

.sco-mypage-left {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-right: 1px solid var(--sco-xp-border);
  background: #ece9d8;
}

.sco-folder-pane,
.sco-nav-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
}

.sco-nav-pane {
  border-top: 1px solid #c0c0c0;
}

.sco-pane-title {
  font-size: 10px;
  font-weight: bold;
  text-transform: uppercase;
  color: #555;
  padding: 6px 8px 4px;
  background: #d4d0c8;
  border-bottom: 1px solid #b0b0b0;
}

.sco-pane-actions {
  padding: 6px 8px;
  border-top: 1px solid #c0c0c0;
}

.sco-pane-actions button {
  border: none;
  background: none;
  color: #004488;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  padding: 0;
}

.sco-mypage-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
}

.sco-file-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  background: #d4d0c8;
  border-bottom: 1px solid #808080;
  flex-shrink: 0;
}

.sco-file-tab {
  border: none;
  border-right: 1px solid #808080;
  background: #ece9d8;
  padding: 4px 10px;
  font-size: 11px;
  cursor: pointer;
}

.sco-file-tab.active {
  background: #fff;
  font-weight: bold;
}

.sco-frames-pane {
  flex-shrink: 0;
  padding: 8px 10px;
  background: #f5f5f0;
  border-bottom: 1px solid #ccc;
  max-height: 120px;
  overflow: auto;
}

.sco-frames-note {
  margin: 0 0 8px;
  font-size: 11px;
  color: #444;
}

.sco-frames-diagram {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.sco-frame-pane {
  display: inline-flex;
  flex-direction: column;
  min-width: 72px;
  padding: 6px 10px;
  border: 1px solid #808080;
  background: #fff;
  text-decoration: none;
  color: #004488;
  font-size: 11px;
  border-radius: 3px;
}

.sco-frame-pane:hover {
  background: #eef8f1;
  border-color: var(--sco-green);
}

.sco-frame-pane span { font-weight: bold; }
.sco-frame-pane small { color: #666; font-size: 10px; }

.sco-frames-meta {
  margin: 6px 0 0;
  font-size: 10px;
  color: #666;
}

.sco-mypage-editor {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  background: #fff;
}

.sco-design-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.sco-view-tabs {
  display: flex;
  gap: 0;
  background: #ece9d8;
  border-top: 1px solid #808080;
  flex-shrink: 0;
}

.sco-view-tab {
  border: none;
  border-right: 1px solid #808080;
  background: #ece9d8;
  padding: 4px 12px;
  font-size: 11px;
  cursor: pointer;
}

.sco-view-tab.active {
  background: #fff;
  font-weight: bold;
}

.sco-file-list {
  flex: 1 1 auto;
  overflow: auto;
  background: #ece9d8;
}

.sco-file-list button {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  border-bottom: 1px solid #d0d0d0;
  background: transparent;
  padding: 6px 10px;
  font-size: 11px;
  cursor: pointer;
}

.sco-file-list button.active {
  background: var(--sco-xp-highlight);
  color: #fff;
}

.sco-nav-tree-root,
.sco-nav-tree-child {
  list-style: none;
  margin: 0;
  padding: 0 0 0 12px;
  font-size: 11px;
}

.sco-nav-tree-root {
  padding: 6px 4px;
}

.sco-nav-node {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: none;
  color: #004488;
  font: inherit;
  padding: 2px 4px;
  cursor: pointer;
}

.sco-nav-node:hover { text-decoration: underline; }
.sco-nav-node.active { font-weight: bold; color: #000; }

.sco-pro-warn {
  padding: 8px 12px;
  background: #fff8dc;
  border-bottom: 1px solid #c0a000;
  font-size: 11px;
  color: #333;
}

.sco-pro-warn button {
  border: none;
  background: none;
  color: #004488;
  font: inherit;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
}

.sco-pro-warn a { color: #004488; }

.sco-template-dlg { max-width: 640px; }
.sco-template-intro { margin: 0 0 12px; font-size: 12px; }
.sco-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
}
.sco-template-cell {
  border: 1px solid #808080;
  background: #fff;
  padding: 6px;
  cursor: pointer;
  text-align: left;
  font: inherit;
}
.sco-template-cell.selected { border-color: var(--sco-green); background: #eef8f1; }
.sco-template-name { font-weight: bold; font-size: 11px; margin-top: 4px; }
.sco-template-desc { font-size: 10px; color: #555; }

.sco-code-editor {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
  font-family: var(--sco-font-mono);
  font-size: 12px;
  padding: 8px;
  resize: none;
  box-sizing: border-box;
}

/* Clipart gallery dialog */
.sco-dialog.sco-clipart-dlg {
  width: 520px;
  max-width: 95vw;
}

.scoClipartDlgInner {
  width: 100%;
}

.scoClipartField {
  display: block;
  margin: 0 0 8px;
  font-size: 11px;
  line-height: 1.3;
}

.scoClipartField .sco-input-wide,
.scoClipartField input,
.scoClipartField select {
  display: block;
  width: 100%;
  max-width: none;
  margin-top: 4px;
  box-sizing: border-box;
}

.scoClipartTop {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 8px 10px;
  margin-bottom: 8px;
  font-size: 11px;
  align-items: end;
}

.scoClipartTop .scoClipartField:first-child {
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 0;
}

.scoClipartTopBtn {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  padding-bottom: 2px;
}

.scoClipartFieldCat {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-bottom: 0;
}

.scoClipartTopSep {
  display: none;
}

.scoClipartStatus {
  font-size: 10px;
  color: #444;
  margin-bottom: 6px;
  min-height: 14px;
}

.scoClipartGrid {
  height: 180px;
  overflow: auto;
  border: 1px solid #b0b0b0;
  background: #fafafa;
  margin-bottom: 6px;
}

.scoClipartGridTable {
  width: 100%;
}

.scoClipartCell {
  width: 80px;
  text-align: center;
  vertical-align: top;
  border: 2px solid transparent;
}

.scoClipartCell.scoClipartPickOn {
  border-color: #18a558;
  background: #e8f5e9;
}

.scoClipartPick {
  display: block;
  text-decoration: none;
  padding: 2px;
}

.scoClipartPick img {
  display: block;
  margin: 0 auto;
  border: 1px solid #ccc;
  background: #fff;
}

.scoClipartEmpty {
  padding: 24px;
  text-align: center;
  color: #666;
}

.scoClipartPager {
  text-align: center;
  margin-bottom: 8px;
  font-size: 11px;
}

.scoClipartPager .sco-dialog-btn {
  margin: 0 4px;
}

.scoClipartPreview {
  border: 1px solid #d0d0d0;
  background: #f8f8f8;
  padding: 6px 8px;
  margin-bottom: 8px;
  min-height: 72px;
  overflow: hidden;
}

.scoClipartPreview img {
  float: left;
  margin: 0 10px 4px 0;
  border: 1px solid #bbb;
  background: #fff;
}

.scoClipartPreviewText {
  font-size: 10px;
  line-height: 1.35;
  color: #333;
}

.scoClipartKw {
  color: #666;
  font-style: italic;
}

/* myPage code hints */
.sco-code-hints {
  position: fixed;
  z-index: 9500;
  min-width: 140px;
  max-width: 260px;
  max-height: 200px;
  overflow: auto;
  background: #fff;
  border: 1px solid var(--sco-xp-border);
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
  font-family: var(--sco-font-mono);
  font-size: 11px;
}

.sco-code-hint {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: transparent;
  padding: 4px 8px;
  font: inherit;
  cursor: pointer;
}

.sco-code-hint:hover,
.sco-code-hint.active {
  background: #e8f5e9;
  color: #000;
}

.sco-insert-html-label {
  margin: 10px 0 4px;
  font-size: 11px;
  font-weight: bold;
  color: #444;
}

.sco-insert-html-label:first-child {
  margin-top: 0;
}

.sco-insert-html-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.sco-insert-html-btn {
  margin: 0 !important;
  font-size: 11px;
  padding: 3px 8px !important;
}

.sco-dialog.sco-insert-html-dlg {
  width: 480px;
  max-width: 95vw;
}

.sco-link-check {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  margin-top: 8px;
}

.sco-link-check th,
.sco-link-check td {
  border: 1px solid #ccc;
  padding: 4px 6px;
  text-align: left;
}

.sco-link-check th {
  background: #ece9d8;
}

.sco-spell-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 8px 0;
}

.sco-spell-word {
  margin: 0 !important;
}

.sco-dialog.sco-seo-meta-dlg {
  width: 560px;
  max-width: 96vw;
  max-height: 90vh;
}

.sco-dialog.sco-seo-meta-dlg .sco-dialog-body {
  max-height: calc(90vh - 120px);
  overflow-y: auto;
}

.sco-seo-dlg .sco-seo-section {
  margin: 0 0 12px;
  padding: 8px 10px 10px;
  border: 1px solid #ccc;
  border-radius: 2px;
}

.sco-seo-dlg .sco-seo-section legend {
  font-weight: bold;
  padding: 0 4px;
}

.sco-seo-field {
  margin-bottom: 8px;
}

.sco-seo-field:last-child {
  margin-bottom: 0;
}

.sco-seo-field .scoClipartField {
  margin-bottom: 0;
}

.sco-seo-field .sco-input-wide,
.sco-seo-field .sco-seo-textarea {
  max-width: none;
  box-sizing: border-box;
}

.sco-seo-textarea {
  resize: vertical;
  min-height: 2.5em;
}

.sco-seo-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: normal;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 4px;
  vertical-align: middle;
}

.sco-seo-badge-ok {
  background: #e8f5e9;
  color: #2e7d32;
  border: 1px solid #a5d6a7;
}

.sco-seo-badge-missing {
  background: #fff3e0;
  color: #e65100;
  border: 1px solid #ffcc80;
}

.sco-seo-missing {
  border-left: 3px solid #ffb74d;
  padding-left: 8px;
}

.sco-seo-ok {
  border-left: 3px solid #81c784;
  padding-left: 8px;
}

.sco-seo-note {
  display: block;
  font-size: 10px;
  color: #666;
  font-weight: normal;
  margin: 2px 0 4px;
}

.sco-seo-sitefile {
  margin-bottom: 10px;
  padding: 6px 8px;
  background: #f9f9f9;
  border: 1px solid #ddd;
}

.sco-seo-sitefile:last-child {
  margin-bottom: 0;
}

.sco-seo-sitefile-preview {
  margin-top: 4px;
  font-size: 10px;
  word-break: break-all;
}

.sco-ht-dlg .sco-ht-table {
  width: 100%;
  border-collapse: collapse;
  margin: 4px 0 0;
}

.sco-ht-dlg .sco-ht-table th,
.sco-ht-dlg .sco-ht-table td {
  text-align: left;
  padding: 2px 4px 4px 0;
  vertical-align: top;
  font-size: 11px;
}

.sco-ht-dlg .sco-ht-table th {
  color: #555;
  font-weight: bold;
}

.sco-ht-dlg .sco-ht-gone-row {
  margin-bottom: 4px;
}

.sco-ht-dlg .sco-ht-check-cell {
  white-space: nowrap;
  font-size: 11px;
  vertical-align: middle;
}

.sco-ht-dlg .sco-ht-pseudo-table th:nth-child(4),
.sco-ht-dlg .sco-ht-pseudo-table td:nth-child(4) {
  width: 5.5em;
}

.sco-ht-dlg .sco-ht-preview,
.sco-ht-dlg .sco-ht-custom {
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  width: 100%;
  box-sizing: border-box;
}

.sco-form-muted {
  margin: 4px 0 0;
  font-size: 10px;
  color: #666;
}

.sco-seo-page-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 16px;
  margin-bottom: 12px;
  padding: 8px 10px;
  background: #f0f4f8;
  border: 1px solid #c5d4e3;
}

.sco-seo-page-pick {
  flex: 1 1 200px;
  margin-bottom: 0 !important;
}

.sco-seo-page-hint {
  flex: 1 1 180px;
  font-size: 11px;
  color: #444;
}

.sco-seo-pages-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.sco-seo-pages-table th,
.sco-seo-pages-table td {
  border: 1px solid #ccc;
  padding: 4px 6px;
  text-align: left;
}

.sco-seo-pages-table th {
  background: #ece9d8;
}

.sco-seo-page-row {
  cursor: pointer;
}

.sco-seo-page-row:hover {
  background: #f5f5ff;
}

.sco-seo-page-row.sco-seo-page-active {
  background: #e3f2fd;
  font-weight: bold;
}

.sco-seo-cell-missing {
  color: #999;
}

.sco-dialog.sco-social-meta-dlg {
  width: 580px;
  max-width: 96vw;
}

.sco-social-dlg .sco-social-row {
  display: grid;
  grid-template-columns: 160px 1fr 32px;
  gap: 6px 8px;
  align-items: center;
  margin-bottom: 8px;
}

.sco-social-dlg .sco-social-row .sco-input-wide {
  max-width: none;
  box-sizing: border-box;
}

.sco-social-dlg .sco-social-remove {
  padding: 2px 8px !important;
  font-size: 16px;
  line-height: 1;
}

.sco-dialog.sco-contact-meta-dlg {
  width: 520px;
  max-width: 96vw;
}

.sco-contact-dlg .sco-contact-field {
  display: block;
  margin-bottom: 10px;
}

.sco-contact-dlg .sco-contact-field:last-child {
  margin-bottom: 0;
}

.sco-contact-dlg .sco-input-wide {
  max-width: none;
  box-sizing: border-box;
}

#scoSocialAdd {
  margin-top: 4px;
}