.howoo-lab-layout,
.howoo-lab-detail { margin-block: 18px; }

.howoo-lab-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.howoo-lab-card {
  display: grid;
  min-height: 260px;
  padding: 18px;
  align-content: space-between;
  color: var(--cream);
  background: #757f4a;
  text-decoration: none;
}

.howoo-lab-card h1 { margin: 0; font-size: var(--type-t1-size); font-weight: var(--type-t1-weight); line-height: var(--type-t1-line-height); letter-spacing: var(--type-t1-letter-spacing); }
.howoo-lab-card dl { margin: 18px 0; }
.howoo-lab-card dl div { display: flex; gap: 18px; padding-block: 10px; justify-content: space-between; border-top: 1px solid rgb(252 252 251 / 20%); }
.howoo-lab-card :is(dt, dd, span),
.howoo-lab-status,
.howoo-lab-detail-content :is(p, dt, dd, th, td, a) { font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.howoo-lab-card dt { color: rgb(252 252 251 / 60%); }
.howoo-lab-card dd { margin: 0; }
.howoo-lab-card span { color: var(--acid); }
.howoo-lab-status { min-height: 1.6em; color: var(--acid); }
.howoo-lab-detail-content { padding: 18px; overflow-x: auto; background: #757f4a; }
.howoo-lab-detail-content table { width: 100%; border-collapse: collapse; }
.howoo-lab-detail-content :is(th, td) { padding: 10px; text-align: left; border-top: 1px solid rgb(252 252 251 / 20%); }
.howoo-lab-detail-content th { color: rgb(252 252 251 / 60%); }
.howoo-lab-detail-content h2 { margin: 0 0 18px; font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }

.admin-records-console {
  display: grid;
  height: min(580px, calc(100dvh - 230px));
  min-height: 420px;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 16px;
}
.admin-records-console > header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 360px); gap: 16px; align-items: center; }
.admin-records-console > header > div,
.admin-records-console > header label,
.admin-orders-search { display: grid; min-width: 0; gap: 4px; }
.admin-records-console :is(h2, p) { margin: 0; }
.admin-records-console :is(button, input, span, label) { font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.admin-records-console input, .admin-orders-search input { width: 100%; min-width: 0; min-height: 44px; padding: 8px 10px; color: var(--ink); border: var(--container-border); border-radius: var(--container-radius); background: var(--cream); }
.admin-owner-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; overflow-wrap: anywhere; }
.admin-owner-filter a { color: var(--acid); text-underline-offset: 4px; }
.admin-records-console [data-admin-records-search] { width: 100%; min-width: 0; }
.admin-records-table-wrap { min-width: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.admin-records-table-wrap table { min-width: 640px; table-layout: fixed; }
.admin-records-table-wrap th:first-child { width: 46%; }
.admin-records-table-wrap th:nth-child(2) { width: 18%; }
.admin-records-table-wrap th:nth-child(3) { width: 24%; }
.admin-records-console[data-records-kind="logins"] th { width: 30%; }
.admin-records-console[data-records-kind="logins"] th:last-child { width: 40%; }
.admin-records-table-wrap summary { color: var(--acid); cursor: pointer; }
.admin-records-table-wrap :is(th, td) { padding: 6px 10px; }
.admin-records-table-wrap td { overflow-wrap: anywhere; }
.admin-records-table-wrap a { color: inherit; text-underline-offset: 4px; }
.admin-records-console :is(button, input, a):focus-visible { outline: 3px solid var(--acid); outline-offset: -3px; }

.howoo-lab-detail-content.admin-orders-detail-content {
  height: 100%;
  min-height: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}

.admin-orders-console {
  display: grid;
  height: 100%;
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  color: var(--cream);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: var(--ink);
}

.admin-orders-console :is(h2, h3, p) { margin: 0; }
.admin-orders-console :is(h2, h3) { font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }
.admin-orders-console :is(button, input, label, select, strong, span, dt, dd, p, a, th, td) { font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.admin-orders-console-header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 360px); min-height: 70px; gap: 18px; padding: 14px 18px; align-items: center; border-bottom: 1px solid rgb(252 252 251 / 20%); }
.admin-orders-search input:focus-visible { outline: 2px solid var(--acid); outline-offset: 2px; }
.admin-orders-console-header > div { display: grid; gap: 2px; }
.admin-orders-console-header p,
.admin-orders-console-header > span { color: rgb(252 252 251 / 62%); }
.admin-orders-dashboard { display: grid; min-height: 0; padding: 14px; grid-template-columns: minmax(480px, 1.45fr) minmax(250px, .55fr); gap: 14px; }
.admin-orders-directory { min-width: 0; min-height: 0; overflow: hidden; border: 1px solid rgb(252 252 251 / 28%); border-radius: 10px; }
.admin-orders-directory { color: var(--cream); background: #757f4a; }
.admin-orders-directory > header { display: flex; gap: 12px; padding: 14px; align-items: center; justify-content: space-between; border-bottom: 1px solid rgb(252 252 251 / 22%); }
.admin-orders-directory > header span { color: rgb(252 252 251 / 68%); }
.admin-orders-table-wrap { max-height: calc(100% - 66px); overflow: auto; }
.admin-orders-directory table { min-width: 660px; }
.admin-orders-directory td:first-child > :is(strong, span) { display: block; }
.admin-orders-directory td:first-child span { color: rgb(252 252 251 / 62%); }
.admin-orders-directory button {
  display: inline-grid;
  min-height: 44px;
  padding: 8px 12px;
  place-items: center;
  color: var(--ink);
  border: 1px solid rgb(8 8 8 / 32%);
  border-radius: 8px;
  background: var(--cream);
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
}
.admin-orders-directory button[aria-pressed="true"] { background: var(--acid); }
.admin-order-queues { min-width: 0; min-height: 0; overflow: auto; border-left: 1px solid rgb(252 252 251 / 20%); }
.admin-order-queue { color: var(--cream); border-bottom: 1px solid rgb(252 252 251 / 20%); }
.admin-order-queue > header { display: flex; gap: 10px; padding: 12px 4px 10px 14px; align-items: center; justify-content: space-between; }
.admin-order-queue > header span { color: rgb(252 252 251 / 58%); }
.admin-order-queue-overdue > header h3 { color: #e88878; }
.admin-order-queue-list { display: grid; align-content: start; }
.admin-order-queue-list > p { padding: 0 14px 10px; color: rgb(252 252 251 / 42%); }
.admin-order-queue button { display: grid; width: 100%; min-height: 44px; padding: 8px 14px; gap: 1px; justify-items: start; color: var(--cream); border: 0; border-top: 1px solid rgb(252 252 251 / 10%); background: transparent; text-align: left; cursor: pointer; }
.admin-order-queue button[aria-pressed="true"] { color: var(--acid); background: rgb(203 213 114 / 9%); }
.admin-order-queue button :is(strong, span) { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-order-queue button span { color: rgb(252 252 251 / 52%); }
.admin-order-preview-dialog .admin-order-detail-empty { display: grid; min-height: 320px; place-content: center; text-align: center; }
.admin-order-preview-dialog .admin-order-detail-empty p { color: rgb(252 252 251 / 62%); }
.admin-order-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.admin-order-actions :is(button, a) { display: grid; min-height: 44px; padding: 8px 12px; place-items: center; color: var(--cream); border: var(--container-border); border-radius: var(--container-radius); background: transparent; text-decoration: none; cursor: pointer; }
.admin-order-actions .admin-order-export { grid-column: 1 / -1; color: var(--ink); border-color: var(--acid); background: var(--acid); }
.admin-order-actions :is(button, a)[disabled] { opacity: .52; cursor: wait; }
.admin-order-production { gap: 10px; }
.admin-order-progress-row { display: flex; flex-direction: column; min-width: 0; gap: 8px; padding-top: 10px; align-items: stretch; justify-content: space-between; }
.admin-order-progress-current { white-space: nowrap; }
.admin-order-status-action { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.admin-order-status-action button { min-height: 44px; padding: 8px 12px; color: var(--cream); border: var(--container-border); border-radius: var(--container-radius); background: transparent; cursor: pointer; }
.admin-order-status-action button[aria-pressed="true"] { border-color: var(--acid); color: var(--acid); }
.admin-order-status-action button:disabled { opacity: .6; cursor: default; }
.admin-order-shipping-address { white-space: pre-line; overflow-wrap: anywhere; }
.admin-order-update-dialog { width: min(440px, calc(100vw - 32px)); box-sizing: border-box; max-height: calc(100dvh - 32px); padding: 24px; color: var(--cream); background: var(--ink); border: var(--container-border); border-radius: var(--container-radius); font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.admin-order-update-dialog::backdrop { background: rgb(0 0 0 / 55%); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.admin-order-update-dialog form { display: grid; gap: 16px; }
.admin-order-update-dialog h2 { margin: 0; font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }
.admin-order-update-dialog p { margin: 0; }
.admin-order-update-dialog [data-admin-status-error]:empty { display: none; }
.admin-order-update-dialog :is(input, select) { box-sizing: border-box; width: 100%; min-height: 44px; margin-top: 6px; padding: 8px 12px; font: inherit; color: var(--cream); background: var(--ink); border: var(--container-border); border-radius: var(--container-radius); }
.admin-order-update-dialog [data-admin-tracking-field]:not([hidden]) { display: grid; gap: 6px; }
.admin-order-update-dialog [data-admin-tracking-field] label:not(:first-child) { margin-top: 10px; }
.admin-order-update-dialog :is(input, select)[aria-invalid="true"] { border-color: #ffb5aa; }
.admin-order-update-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.admin-order-update-actions button { min-height: 44px; padding: 8px 12px; font: inherit; color: var(--cream); background: transparent; border: var(--container-border); border-radius: var(--container-radius); cursor: pointer; }
.admin-order-update-actions button[type="submit"] { color: var(--ink); background: var(--acid); }
.admin-order-update-dialog :is(input, select, button):focus-visible { outline: 2px solid var(--acid); outline-offset: 2px; }
.admin-order-progress-status { min-height: 1.6em; color: rgb(252 252 251 / 62%); }
.admin-order-progress-status:empty { display: none; }
.admin-order-export-status { min-height: 1.6em; color: rgb(252 252 251 / 62%); }
.admin-order-runtime { position: fixed; left: -10000px; width: 720px; height: 540px; visibility: hidden; pointer-events: none; }
.admin-order-runtime > :is(.terrain-preview-window, .satellite-map, .editor-component, .workflow-action-card) { width: 720px; height: 540px; }
.admin-orders-console :is(button, select, a):focus-visible,
.admin-order-preview-dialog :is(button, select, a):focus-visible { outline: 3px solid var(--acid); outline-offset: 2px; }
.admin-orders-console :is(button, a):active,
.admin-order-preview-dialog :is(button, a):active { filter: brightness(.82); }

@media (hover: hover) and (pointer: fine) {
  .admin-orders-console :is(button, a):hover,
  .admin-order-preview-dialog :is(button, a):hover { filter: brightness(.92); }
}

@media (min-width: 1024px) {
  .howoo-lab-page[data-admin-section="orders"] .howoo-lab-detail { height: calc(100dvh - 98px); min-height: 0; margin-block: 12px; }
  .howoo-lab-page[data-admin-section="orders"] .howoo-lab-status:empty { display: none; }
}

@media (max-width: 1023px) {
  .admin-orders-dashboard { grid-template-columns: minmax(390px, 1.2fr) minmax(220px, .8fr); }
}

@media (max-width: 743px) {
  .admin-orders-dashboard { overflow: auto; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(360px, 1fr) auto; }
  .admin-order-queues { border-left: 0; border-top: 1px solid rgb(252 252 251 / 20%); }
  .admin-order-actions { grid-template-columns: minmax(0, 1fr); }
  .admin-order-actions .admin-order-export { grid-column: auto; }
  .admin-order-progress-row { align-items: stretch; flex-direction: column; }
}

.howoo-lab-page[data-admin-section="users"] .howoo-lab-detail {
  align-self: start;
}

.howoo-lab-page.draft-detail-page[data-admin-section="users"] .howoo-lab-detail {
  width: min(960px, 90vw);
}

.howoo-lab-detail-content.admin-users-detail-content {
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}

.howoo-lab-page[data-admin-section="users"] .howoo-lab-status:empty { display: none; }

.admin-users-console {
  display: grid;
  height: min(560px, calc(100dvh - 220px));
  min-height: 524px;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: stretch;
}

.admin-users-console :is(h2, h3, p) { margin: 0; }
.admin-users-console :is(h2, h3) { font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }
.admin-users-console :is(button, input, strong, span, dt, dd, p) { font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.admin-users-directory,
.admin-user-detail { min-width: 0; min-height: 0; }

.admin-users-directory {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px;
  border: var(--container-border);
  border-radius: var(--container-radius);
}

.admin-users-directory > header {
  display: grid;
  gap: 10px;
}
.admin-users-directory > header > div { display: flex; gap: 8px; align-items: baseline; justify-content: space-between; }
.admin-users-directory > header p { color: rgb(252 252 251 / 68%); }
.admin-users-directory > header label { display: grid; min-width: 0; gap: 4px; }
.admin-users-directory input {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  color: var(--ink);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: var(--cream);
}

.admin-users-pagination {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
}
.admin-users-page-jump { display: flex; min-width: 0; gap: 6px; margin: 0; align-items: center; }
.admin-users-page-jump [data-admin-users-page] { white-space: nowrap; }
.admin-users-page-jump input {
  width: 56px;
  min-width: 0;
  padding-inline: 4px;
  color: var(--cream);
  background: transparent;
  text-align: center;
  appearance: textfield;
}
.admin-users-page-jump input::-webkit-inner-spin-button,
.admin-users-page-jump input::-webkit-outer-spin-button { margin: 0; appearance: none; }
.admin-users-pagination button {
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  flex: 0 0 44px;
  place-items: center;
  color: var(--cream);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}
.admin-users-pagination svg { width: 18px; height: 18px; }
.admin-users-pagination button:disabled { opacity: .45; cursor: not-allowed; }

.admin-user-card-list,
.admin-user-work-list {
  display: grid;
  min-width: 0;
  min-height: 0;
  gap: 6px;
  align-content: start;
}
.admin-user-card-list { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.admin-users-console .update-item {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  gap: 10px;
  padding: 8px 12px;
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
}
.admin-users-console .update-item time { flex-shrink: 0; margin-left: 0; }
.admin-users-console .update-item-title { flex: 1; min-width: 0; }
.admin-user-card-list .update-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; }
.admin-user-card-list .update-item time { grid-column: 3; grid-row: 1; }
.admin-user-card-counts { grid-column: 2; grid-row: 1; color: rgb(252 252 251 / 68%); white-space: nowrap; }
.admin-user-work-list .update-item { flex-direction: row; align-items: center; }
.admin-users-console .update-item:hover,
.admin-users-console .update-item:hover :is(.update-item-title, time) { transform: none; box-shadow: none; }
.admin-users-console .update-item[aria-pressed="true"] { background: var(--acid); }
.admin-users-console .update-item[aria-pressed="true"] :is(.update-item-title, time, .admin-user-card-counts),
.admin-users-console .update-item:hover .admin-user-card-counts { color: var(--ink); }
.admin-users-console .update-item[hidden],
.admin-users-console .admin-user-empty[hidden] { display: none; }

.admin-user-detail { display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 14px; color: var(--cream); }
.admin-user-summary {
  display: grid;
  width: 100%;
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 8px;
  padding: 12px;
  overflow: hidden;
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: #757f4a;
}
.admin-user-summary-fields { display: grid; min-height: 0; gap: 1px; margin: 0; align-content: start; }
.admin-user-summary-fields > div { display: grid; min-width: 0; grid-template-columns: 64px minmax(0, 1fr); gap: 8px; align-items: baseline; }
.admin-user-summary-fields dt { color: rgb(252 252 251 / 68%); }
.admin-user-summary-fields dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.admin-user-profile-link,
.admin-user-more-link {
  display: flex;
  min-height: 32px;
  align-items: center;
  color: inherit;
  text-underline-offset: 4px;
  touch-action: manipulation;
}
.admin-user-profile-link[hidden],
.admin-user-more-link[hidden] { display: none; }
.admin-user-works {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: auto auto auto;
  gap: 8px;
  align-content: start;
}
.admin-user-empty { color: rgb(252 252 251 / 68%); }

.howoo-lab-detail-content.admin-user-profile-content {
  padding: 0;
  background: #151613;
  color: var(--cream);
  font-size: var(--type-t3-size);
  font-weight: var(--type-t3-weight);
  line-height: var(--type-t3-line-height);
  letter-spacing: var(--type-t3-letter-spacing);
}
.admin-user-profile-content :is(h2, h3) { margin: 0; font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }
.admin-user-detail-header {
  display: flex;
  min-height: 72px;
  gap: 14px;
  padding: 16px 24px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgb(252 252 251 / 20%);
}
.admin-user-detail-header > div { display: grid; min-width: 0; gap: 2px; }
.admin-user-detail-header p { margin: 0; color: rgb(252 252 251 / 68%); }
.admin-user-detail-header h2 { margin: 0; overflow-wrap: anywhere; font-size: var(--type-t1-size); font-weight: var(--type-t1-weight); line-height: var(--type-t1-line-height); letter-spacing: var(--type-t1-letter-spacing); }
.admin-user-detail-header .admin-user-profile-link { margin: 0; }
.admin-user-detail-section { display: grid; gap: 18px; padding: 24px; border-bottom: 1px solid rgb(252 252 251 / 12%); }
.admin-user-section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.admin-user-detail-section:last-child { border-bottom: 0; }
.howoo-lab-detail-content.admin-work-detail-content {
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}
.admin-work-detail-content .preview-3d-dialog-details { align-self: stretch; }
.admin-work-tools {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 12px;
}
.admin-work-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: auto;
  gap: 8px;
  align-items: stretch;
}
.admin-work-actions :is(button, a) {
  display: inline-flex;
  min-width: 0;
  min-height: 44px;
  padding: 8px 4px;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--cream);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: transparent;
  font-size: var(--type-t3-size);
  font-weight: var(--type-t3-weight);
  line-height: var(--type-t3-line-height);
  letter-spacing: var(--type-t3-letter-spacing);
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
}
.admin-work-actions button:disabled { opacity: .45; cursor: not-allowed; }
.admin-work-tools [hidden] { display: none; }
.content-dialog.admin-work-parameters-dialog {
  width: min(440px, calc(100vw - 32px));
  color: var(--cream);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: var(--ink);
  font-size: var(--type-t3-size);
  font-weight: var(--type-t3-weight);
  line-height: var(--type-t3-line-height);
  letter-spacing: var(--type-t3-letter-spacing);
}
.admin-work-parameters-dialog .content-dialog-panel { padding: 16px; }
.content-dialog.admin-work-parameters-dialog header { margin-bottom: 12px; align-items: center; }
.content-dialog.admin-work-parameters-dialog h2 {
  font-size: var(--type-t2-size);
  font-weight: var(--type-t2-weight);
  line-height: var(--type-t2-line-height);
  letter-spacing: var(--type-t2-letter-spacing);
}
.content-dialog.admin-work-parameters-dialog p { color: inherit; }
.admin-user-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}
.admin-user-stat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-user-stat-grid > div { position: relative; min-width: 0; padding: 18px; border: 1px solid rgb(252 252 251 / 10%); border-radius: var(--container-radius); background: var(--ink); }
.admin-user-stat-grid dd a { color: inherit; font: inherit; text-decoration: none; }
.admin-user-stat-grid dd a::after { content: ''; position: absolute; inset: 0; border-radius: var(--container-radius); }
.admin-user-stat-grid > div:has(a):is(:hover, :focus-within) { border-color: var(--acid); }
.admin-user-stat-grid dt { color: rgb(252 252 251 / 68%); }
.admin-user-stat-grid dd { display: flex; align-items: baseline; gap: 6px; margin: 10px 0 0; overflow-wrap: anywhere; color: var(--acid); font-size: var(--type-t1-size); font-weight: var(--type-t1-weight); line-height: var(--type-t1-line-height); letter-spacing: var(--type-t1-letter-spacing); }
.admin-user-stat-grid dd a span { margin-left: 6px; }
.admin-user-stat-grid dd span { color: rgb(252 252 251 / 60%); font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.admin-user-stat-definitions summary { width: fit-content; cursor: pointer; color: var(--acid); }
.admin-user-stat-definitions dl { display: grid; gap: 12px; margin: 16px 0 0; }
.admin-user-stat-definitions dd { margin: 4px 0 0; color: rgb(252 252 251 / 68%); }
.admin-user-risk { padding: 4px 8px; color: rgb(252 252 251 / 68%); border-radius: var(--container-radius); background: rgb(203 213 114 / 8%); }
.admin-user-risk[data-risk="warning"] { color: #ffb5aa; background: rgb(255 181 170 / 12%); }
.admin-users-console :is(button, input, a):focus-visible,
.admin-user-profile-content :is(a, button, h2):focus-visible,
.admin-work-tools :is(button, a):focus-visible { outline: 3px solid var(--acid); outline-offset: -3px; }
.admin-users-directory button:not(:disabled):active,
.admin-user-profile-link:active,
.admin-user-more-link:active,
.admin-work-tools :is(button, a):active { filter: brightness(.82); }

@media (hover: hover) and (pointer: fine) {
  .admin-users-directory button:not(:disabled):hover,
  .admin-user-profile-link:hover,
  .admin-user-more-link:hover,
  .admin-work-tools :is(button, a):hover { filter: brightness(.92); }
}

.howoo-lab-detail-content.publishing-detail-content {
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}

.publishing-console {
  display: grid;
  grid-template-columns: minmax(220px, .68fr) minmax(420px, 1.45fr) minmax(250px, .78fr);
  height: min(720px, calc(100dvh - 180px));
  min-height: 620px;
  overflow: hidden;
  color: var(--cream);
  border: var(--container-border);
  border-radius: var(--container-radius);
  background: #757f4a;
}

.publishing-console [hidden] { display: none; }
.publishing-console :is(h2, h3, p) { margin: 0; }
.publishing-console :is(h2, h3) { font-size: var(--type-t2-size); font-weight: var(--type-t2-weight); line-height: var(--type-t2-line-height); letter-spacing: var(--type-t2-letter-spacing); }
.publishing-console :is(button, input, textarea, strong, span, small, label, output, p, a) { font-size: var(--type-t3-size); font-weight: var(--type-t3-weight); line-height: var(--type-t3-line-height); letter-spacing: var(--type-t3-letter-spacing); }
.publishing-mailbox,
.publishing-composer,
.publishing-insight { min-width: 0; min-height: 0; }

.publishing-mailbox {
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  align-content: start;
  border-right: var(--container-border);
}

.publishing-mailbox-header,
.publishing-composer-header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.publishing-mailbox-header { padding: 14px; border-bottom: 1px solid rgb(252 252 251 / 22%); }
.publishing-mailbox-header > div,
.publishing-composer-header > div:first-child { display: grid; gap: 2px; min-width: 0; }
.publishing-mailbox-header p { color: rgb(252 252 251 / 66%); }

.publishing-create {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-bottom: 1px solid rgb(252 252 251 / 22%);
  background: rgb(5 5 5 / 16%);
}

.publishing-type-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.publishing-type-picker legend,
.publishing-slug { margin-bottom: 2px; }
.publishing-type-picker label {
  display: grid;
  min-height: 72px;
  gap: 6px;
  padding: 10px;
  color: var(--ink);
  border: var(--container-border);
  border-radius: 8px;
  background: var(--cream);
  cursor: pointer;
}
.publishing-type-picker input { width: 18px; height: 18px; margin: 0; accent-color: #757f4a; }
.publishing-type-picker label > span { display: grid; gap: 2px; }
.publishing-type-picker small { color: rgb(8 8 8 / 62%); }
.publishing-type-picker label:has(input:checked) { background: var(--acid); }

.publishing-slug-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.publishing-slug-control input,
.publishing-search input,
.publishing-image-panel input {
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  color: var(--ink);
  border: var(--container-border);
  border-radius: 8px;
  background: var(--cream);
}
.publishing-slug-control input { border-radius: 8px 0 0 8px; }
.publishing-slug-control > span { min-height: 44px; padding: 9px 10px; color: var(--ink); border: var(--container-border); border-left: 0; border-radius: 0 8px 8px 0; background: var(--acid); }
.publishing-help { color: rgb(252 252 251 / 68%); }
.publishing-create-actions,
.publishing-image-actions,
.publishing-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

.publishing-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid rgb(252 252 251 / 22%); }
.publishing-filters button,
.publishing-toolbar button {
  min-height: 44px;
  padding: 8px;
  color: inherit;
  border: 0;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}
.publishing-filters button[aria-pressed="true"] { color: var(--ink); background: var(--acid); }
.publishing-search { display: grid; gap: 6px; padding: 12px 14px; border-bottom: 1px solid rgb(252 252 251 / 22%); }
.publishing-search > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

.publishing-archive-list { display: grid; min-height: 0; overflow-y: auto; align-content: start; }
.publishing-archive-item {
  display: grid;
  width: 100%;
  min-height: 78px;
  gap: 2px;
  padding: 10px 14px;
  text-align: left;
  color: var(--cream);
  border: 0;
  border-bottom: 1px solid rgb(252 252 251 / 18%);
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}
.publishing-archive-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.publishing-archive-item span { overflow: hidden; color: rgb(252 252 251 / 62%); text-overflow: ellipsis; white-space: nowrap; }
.publishing-archive-item[aria-selected="true"] { color: var(--ink); background: var(--acid); }
.publishing-archive-item[aria-selected="true"] span { color: rgb(8 8 8 / 62%); }
.publishing-list-empty { padding: 18px 14px; color: rgb(252 252 251 / 68%); }

.publishing-composer { height: 100%; overflow: hidden; color: var(--ink); background: var(--cream); }
.publishing-empty-state { display: grid; min-height: 100%; gap: 8px; padding: 24px; place-content: center; text-align: center; }
.publishing-empty-state p { max-width: 42ch; color: rgb(8 8 8 / 62%); }
.publishing-editor {
  display: grid;
  height: 100%;
  min-height: 0;
  grid-template-rows: auto auto auto auto auto minmax(0, 1fr) auto;
  overflow: hidden;
}
.publishing-composer-header { min-height: 72px; padding: 12px 14px; border-bottom: 1px solid rgb(8 8 8 / 16%); }
.publishing-file-meta { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; color: rgb(8 8 8 / 62%); }
.publishing-state { padding: 2px 7px; color: var(--ink); border-radius: 999px; background: var(--acid); }
.publishing-state[data-state="未保存"] { color: var(--cream); background: #757f4a; }
.publishing-editor-status { min-height: 1.6em; margin: 0; color: #59622f; }
.publishing-editor > .publishing-editor-status { padding: 8px 14px; border-bottom: 1px solid rgb(8 8 8 / 12%); }

.publishing-toolbar { display: flex; min-height: 44px; padding-inline: 6px; overflow-x: auto; align-items: stretch; flex-wrap: nowrap; border-bottom: 1px solid rgb(8 8 8 / 16%); }
.publishing-toolbar button { min-width: 44px; color: var(--ink); border-right: 1px solid rgb(8 8 8 / 10%); }
.publishing-command-picker { display: grid; min-width: 92px; grid-template-columns: minmax(0, 1fr); border-right: 1px solid rgb(8 8 8 / 10%); }
.publishing-command-picker > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.publishing-command-picker select { min-height: 44px; padding: 8px; color: var(--ink); border: 0; background: transparent; cursor: pointer; }
.publishing-image-panel { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 10px 12px; padding: 12px 14px; border-bottom: 1px solid rgb(8 8 8 / 16%); background: rgb(203 213 114 / 32%); }
.publishing-image-panel > div:first-child { grid-column: 1 / -1; }
.publishing-image-panel label { display: grid; gap: 4px; }
.publishing-image-actions,
.publishing-image-panel > .publishing-editor-status { grid-column: 1 / -1; }

.publishing-hero-panel { display: grid; gap: 10px; padding: 12px 14px; color: var(--ink); border-bottom: 1px solid rgb(8 8 8 / 16%); background: rgb(203 213 114 / 32%); }
.publishing-hero-header { display: flex; gap: 12px; align-items: center; justify-content: space-between; }
.publishing-hero-header > div { display: grid; gap: 2px; }
.publishing-hero-header p { color: rgb(8 8 8 / 62%); }
.publishing-hero-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.publishing-hero-controls label { display: grid; min-width: 0; gap: 2px; }
.publishing-hero-controls label > span { display: flex; gap: 8px; align-items: center; justify-content: space-between; }
.publishing-hero-controls output { color: #59622f; font-variant-numeric: tabular-nums; }
.publishing-hero-controls input[type="range"] { width: 100%; min-height: 44px; margin: 0; accent-color: #59622f; cursor: pointer; touch-action: manipulation; }

.publishing-source { display: grid; min-width: 0; min-height: 0; grid-template-rows: minmax(0, 1fr) auto; overflow: hidden; }
.publishing-source > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.publishing-editor textarea {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 16px;
  resize: none;
  color: var(--ink);
  border: 0;
  border-radius: 0;
  background: var(--cream);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-weight: 400;
}
.publishing-source footer { display: flex; gap: 12px; min-height: 40px; padding: 8px 14px; align-items: center; justify-content: space-between; color: rgb(8 8 8 / 58%); border-top: 1px solid rgb(8 8 8 / 12%); }
.publishing-view-link { display: block; width: fit-content; margin: 0 14px 14px; color: #59622f; }

.publishing-insight { display: grid; max-height: 680px; gap: 12px; padding: 14px; overflow: auto; align-content: start; color: var(--ink); border-left: var(--container-border); background: #eef0df; }
.publishing-insight-empty { display: grid; min-height: 100%; gap: 8px; place-content: center; text-align: center; }
.publishing-insight-empty p { max-width: 28ch; color: rgb(8 8 8 / 62%); }
.publishing-insight-content { display: grid; gap: 12px; align-content: start; }
.publishing-insight-content h3 { padding-bottom: 10px; border-bottom: 1px solid rgb(8 8 8 / 16%); }
.publishing-insight p { white-space: pre-wrap; overflow-wrap: anywhere; }
.publishing-insight nav { display: grid; gap: 8px; }
.publishing-insight span[data-level="1"] { font-weight: var(--type-t2-weight); }
.publishing-insight span[data-level="2"] { padding-left: 8px; }
.publishing-insight span[data-level="3"] { padding-left: 16px; color: rgb(8 8 8 / 68%); }
.publishing-insight span[data-level="4"] { padding-left: 24px; color: rgb(8 8 8 / 64%); }
.publishing-insight span[data-level="5"] { padding-left: 32px; color: rgb(8 8 8 / 60%); }
.publishing-insight span[data-level="6"] { padding-left: 40px; color: rgb(8 8 8 / 56%); }

.publishing-action {
  min-height: 44px;
  padding: 8px 14px;
  color: var(--ink);
  border: 1px solid rgb(8 8 8 / 32%);
  border-radius: 8px;
  background: var(--cream);
  cursor: pointer;
  touch-action: manipulation;
}
.publishing-primary { background: var(--acid); }
.publishing-action:disabled { cursor: not-allowed; opacity: .45; }

.publishing-console :is(button, input, textarea, select, a):focus-visible,
.publishing-type-picker input:focus-visible { outline: 3px solid var(--acid); outline-offset: -3px; }
.publishing-action:active,
.publishing-filters button:active,
.publishing-toolbar button:active,
.publishing-archive-item:active { filter: brightness(.82); }

@media (hover: hover) and (pointer: fine) {
  .publishing-action:not(:disabled):hover,
  .publishing-filters button:hover,
  .publishing-toolbar button:hover,
  .publishing-archive-item:hover { filter: brightness(.92); }
}

@media (min-width: 744px) and (max-width: 1199px) {
  .howoo-lab-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .publishing-console { grid-template-columns: minmax(220px, 32%) minmax(0, 1fr); height: auto; min-height: 0; }
  .publishing-insight { grid-column: 2; max-height: none; border-top: var(--container-border); border-left: 0; }
}

@media (max-width: 743px) {
  .howoo-lab-grid { grid-template-columns: minmax(0, 1fr); }
  .admin-work-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-records-console > header { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .admin-orders-console-header { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .admin-users-console { height: auto; min-height: 0; grid-template-columns: minmax(0, 1fr); }
  .admin-users-directory { height: 280px; }
  .admin-user-detail { height: auto; grid-template-rows: auto auto; }
  .admin-user-detail-header { align-items: flex-start; flex-direction: column; }
  .admin-user-detail-header, .admin-user-detail-section { padding: 16px; }
  .admin-user-stat-grid > div { padding: 12px; }
  .admin-user-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .publishing-console { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 0; }
  .publishing-mailbox { border-right: 0; border-bottom: var(--container-border); }
  .publishing-archive-list { max-height: 300px; }
  .publishing-composer-header { align-items: flex-start; flex-direction: column; }
  .publishing-image-panel { grid-template-columns: minmax(0, 1fr); }
  .publishing-image-panel > div:first-child,
  .publishing-image-actions,
  .publishing-image-panel > .publishing-editor-status { grid-column: auto; }
  .publishing-hero-header { align-items: flex-start; flex-direction: column; }
  .publishing-hero-controls { grid-template-columns: minmax(0, 1fr); }
  .publishing-composer { height: auto; overflow: visible; }
  .publishing-editor { height: auto; grid-template-rows: auto; overflow: visible; }
  .publishing-source { overflow: visible; }
  .publishing-editor textarea { height: auto; min-height: 440px; resize: vertical; }
  .publishing-source footer { align-items: flex-start; flex-direction: column; }
  .publishing-insight { max-height: none; border-top: var(--container-border); border-left: 0; }
}