* {
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #222;
  background: #f4f5f8;
}
button,
input,
textarea,
select {
  font: inherit;
}
button {
  cursor: pointer;
  border: 1px solid #d6dbe6;
  padding: 10px 15px;
  border-radius: 7px;
  background: white;
  color: #26324d;
}
button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
a {
  color: inherit;
}
input,
textarea,
select {
  width: 100%;
  border: 1px solid #d6dbe6;
  padding: 12px;
  border-radius: 6px;
  background: #fff;
  color: #222;
}
textarea {
  min-height: 120px;
  resize: vertical;
}
.cms-loading {
  margin: 60px;
}
.cms-login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}
.cms-login form {
  width: min(460px, 100%);
  padding: 36px;
  background: white;
  border: 1px solid #dfe3ea;
  border-radius: 16px;
  box-shadow: 0 12px 40px #17265310;
}
.cms-login .admin-field {
  margin: 22px 0;
}
.cms-login button {
  background: #002fa7;
  color: white;
  width: 100%;
}
.cms-wordmark {
  font-weight: 900;
  letter-spacing: -2px;
  font-size: 32px;
  color: #002fa7;
}
.cms-login p {
  color: #6b7280;
  line-height: 1.6;
}
.cms-panel {
  padding: 28px;
  margin-bottom: 24px;
}
.cms-panel p {
  line-height: 1.7;
}
.cms-panel h2 {
  margin-top: 0;
}
.cms-panel .admin-field {
  margin: 18px 0;
}
.cms-notice {
  padding: 15px 20px;
  border: 1px solid #b8c9ff;
  background: #eef3ff;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.cms-notice button {
  padding: 0 8px;
  border: 0;
  background: none;
}
.cms-work-list {
  margin: 24px 0;
  padding: 0 24px;
}
.cms-work-list article {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px 0;
  border-bottom: 1px solid #eceef4;
}
.cms-work-list article img {
  width: 140px;
  height: 85px;
  object-fit: cover;
  border-radius: 6px;
  background: #f4f4f4;
}
.cms-work-list article div {
  flex: 1;
}
.cms-work-list h3 {
  margin: 0 0 6px;
}
.cms-work-list p {
  margin: 0 0 10px;
  color: #788092;
}
.cms-media {
  padding: 24px;
  margin-bottom: 24px;
}
.cms-media img,
.cms-media video {
  display: block;
  width: 100%;
  max-height: 350px;
  object-fit: contain;
  background: #edf0f6;
  margin-bottom: 20px;
}
.cms-upload {
  display: inline-block;
  border-radius: 6px;
  background: #002fa7;
  color: #fff;
  padding: 11px 18px;
  cursor: pointer;
  margin: 10px 0 18px;
}
.cms-upload input {
  display: block;
  max-width: 320px;
  font-size: 12px;
  color: #fff;
  background: transparent;
  border: 0;
  padding: 8px 0 0;
}
.cms-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 20px;
}
.cms-gallery article {
  border: 1px solid #e0e4ed;
  padding: 16px;
  border-radius: 10px;
}
.cms-gallery img {
  width: 100%;
  height: 200px;
  object-fit: contain;
  background: #f3f5f8;
}
.cms-gallery article > div {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.cms-language-tabs {
  display: flex;
  gap: 10px;
  margin: 18px 0 24px;
}
.cms-language-tabs .active {
  background: #002fa7;
  color: white;
}
.cms-check {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 22px 0;
}
.cms-check input {
  width: 18px;
  height: 18px;
  accent-color: #002fa7;
}
.cms-danger {
  color: #a21a30;
  border-color: #eec9cf;
}
.admin-work-side button {
  display: block;
  width: 100%;
  margin-bottom: 12px;
}
.admin-actions button:last-child {
  background: #002fa7;
  color: white;
}
.admin-field small {
  display: block;
  font-size: 12px;
  color: #7b8497;
  margin: 5px 0;
}
.admin-sidebar nav {
  overflow-y: auto;
}
.admin-sidebar-foot {
  margin-top: auto;
}
@media (max-width: 850px) {
  .cms-gallery {
    grid-template-columns: 1fr;
  }
  .cms-work-list article {
    flex-wrap: wrap;
  }
  .admin-topbar {
    height: auto;
    flex-wrap: wrap;
    gap: 15px;
  }
  .admin-actions {
    flex-wrap: wrap;
  }
  .cms-work-list article img {
    width: 95px;
    height: 70px;
  }
}

.cms-edit-lock {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}
.cms-edit-lock:disabled {
  opacity: 0.85;
}

.admin-detail-layout.is-layout-mode {
  grid-template-columns: minmax(0, 1fr);
}
.admin-detail-layout.is-layout-mode > .admin-work-side {
  display: none;
}
.layout-workbench {
  min-width: 0;
}
.layout-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}
.layout-toolbar h2 {
  margin: 0 0 7px;
  font-size: 26px;
}
.layout-toolbar p {
  margin: 0;
  color: #737b8b;
  font-size: 12px;
}
.layout-device {
  display: flex;
  padding: 3px;
  border: 1px solid #dce1ea;
  border-radius: 8px;
  background: #fff;
}
.layout-device button {
  border: 0;
  padding: 8px 13px;
}
.layout-device .active {
  background: #002fa7;
  color: #fff;
}
.layout-columns {
  display: grid;
  grid-template-columns: 180px minmax(480px, 1fr) 260px;
  gap: 14px;
  align-items: start;
}
.layout-assets,
.layout-inspector {
  position: sticky;
  top: 96px;
  max-height: calc(100svh - 120px);
  overflow: auto;
  padding: 18px;
  border: 1px solid #e0e4ed;
  border-radius: 10px;
  background: #fff;
}
.layout-assets h3,
.layout-inspector h3 {
  margin: 0 0 14px;
  font-size: 13px;
}
.layout-assets > p {
  margin: 0 0 14px;
  color: #858c98;
  font-size: 10px;
  line-height: 1.5;
}
.layout-assets > .cms-upload {
  display: block;
  text-align: center;
}
.layout-assets > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.layout-assets > div > button {
  position: relative;
  padding: 2px;
  overflow: hidden;
  border-radius: 5px;
}
.layout-assets > div > button.active {
  border-color: #002fa7;
  box-shadow: 0 0 0 1px #002fa7;
}
.layout-assets img {
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.layout-assets button span {
  position: absolute;
  left: 5px;
  bottom: 5px;
  padding: 3px;
  background: #fff;
  color: #002fa7;
  font-size: 8px;
}
.layout-canvas {
  min-height: 650px;
  padding: 32px;
  border: 1px solid #dce1ea;
  border-radius: 10px;
  background: #dfe2e8;
  overflow: auto;
}
.layout-canvas.is-mobile {
  display: flex;
  justify-content: center;
}
.layout-page {
  width: 100%;
  min-height: 580px;
  padding: 34px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
  background: #f4f1e9;
  box-shadow: 0 10px 34px #1a25341a;
  align-items: start;
  align-content: start;
}
.layout-canvas.is-mobile .layout-page {
  width: 390px;
  min-width: 390px;
  padding: 20px;
  gap: 10px;
}
.layout-card {
  position: relative;
  min-width: 0;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  text-align: left;
  transition: border-color 0.2s;
}
.layout-card.active {
  border-color: #002fa7;
  box-shadow: 0 0 0 3px #002fa71c;
}
.layout-card > span {
  position: absolute;
  z-index: 2;
  top: 6px;
  left: 6px;
  padding: 4px 6px;
  background: #002fa7;
  color: #fff;
  font-size: 8px;
}
.layout-card img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 40px;
  background: #dde0e4;
}
.layout-card small {
  display: block;
  padding-top: 7px;
  color: #6c7280;
  font-size: 8px;
  line-height: 1.4;
}
.layout-empty {
  padding: 70px 20px;
  color: #7d8490;
  text-align: center;
}
.layout-inspector > img {
  display: block;
  width: 100%;
  max-height: 140px;
  margin-bottom: 16px;
  object-fit: contain;
  background: #f1f2f5;
}
.layout-inspector > label,
.layout-inspector > div:not(.layout-order) {
  display: grid;
  gap: 7px;
  margin: 14px 0;
}
.layout-inspector label > span,
.layout-inspector div > span {
  color: #5f6673;
  font-size: 10px;
}
.layout-inspector nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5px;
}
.layout-inspector nav button {
  padding: 8px 5px;
  font-size: 10px;
}
.layout-inspector nav button.active {
  border-color: #002fa7;
  background: #eef3ff;
  color: #002fa7;
}
.layout-inspector input,
.layout-inspector select {
  padding: 9px;
  font-size: 10px;
}
.layout-inspector .layout-check {
  display: flex;
  grid-template-columns: 16px 1fr;
  align-items: center;
}
.layout-check input {
  width: 16px;
  height: 16px;
}
.layout-order {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 18px;
}
.layout-order .danger {
  grid-column: 1/3;
  color: #a21a30;
  border-color: #eec9cf;
}
@media (max-width: 1180px) {
  .layout-columns {
    grid-template-columns: 140px minmax(420px, 1fr);
  }
  .layout-inspector {
    position: static;
    grid-column: 1/3;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 16px;
    max-height: none;
  }
  .layout-inspector > h3,
  .layout-inspector > img,
  .layout-inspector > p {
    grid-column: 1/4;
  }
  .layout-order {
    align-self: end;
  }
}
@media (max-width: 760px) {
  .layout-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .layout-columns {
    grid-template-columns: 1fr;
  }
  .layout-assets,
  .layout-inspector {
    position: static;
    grid-column: 1;
    max-height: none;
  }
  .layout-assets > div {
    grid-template-columns: repeat(4, 1fr);
  }
  .layout-canvas {
    padding: 12px;
    min-height: 560px;
  }
  .layout-inspector {
    display: block;
  }
  .layout-page {
    padding: 18px;
  }
  .layout-canvas.is-desktop .layout-page {
    min-width: 760px;
  }
}

.layout-card {
  cursor: grab;
}
.layout-card:active {
  cursor: grabbing;
}
.layout-card.active {
  z-index: 3;
}
.layout-direct-tools {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: -42px;
  transform: translateX(-50%);
  display: flex;
  gap: 3px;
  padding: 4px;
  border-radius: 7px;
  background: #18213a;
  box-shadow: 0 5px 16px #11182742;
}
.layout-direct-tools button {
  min-width: 28px;
  padding: 5px 7px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  font-size: 12px;
}
.layout-direct-tools button:hover {
  background: #ffffff24;
}
.layout-resize-handle {
  position: absolute;
  z-index: 5;
  top: 50%;
  width: 22px;
  height: 42px;
  padding: 0;
  transform: translateY(-50%);
  border: 2px solid #fff;
  border-radius: 5px;
  background: #002fa7;
  color: #fff;
  box-shadow: 0 2px 8px #002fa755;
  cursor: ew-resize;
}
.layout-resize-handle.left {
  left: -12px;
}
.layout-resize-handle.right {
  right: -12px;
}
.admin-history-actions {
  display: flex;
}
.admin-history-actions button {
  min-width: 38px;
  padding: 9px;
}
.admin-actions button.is-dirty {
  border-color: #002fa7;
  background: #eef3ff;
  color: #002fa7;
}
.admin-change-drawer {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  width: min(410px, 100vw);
  height: 100vh;
  padding: 24px;
  background: #fff;
  box-shadow: -16px 0 50px #11182724;
  overflow: auto;
}
.admin-change-drawer > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  border-bottom: 1px solid #e5e7eb;
  padding-bottom: 16px;
}
.admin-change-drawer h2 {
  margin: 4px 0;
}
.admin-change-drawer header span {
  font-size: 10px;
  letter-spacing: 0.16em;
  color: #002fa7;
}
.admin-change-drawer header button {
  border: 0;
  font-size: 24px;
  padding: 0 8px;
}
.admin-unsaved-callout {
  padding: 12px;
  background: #eef3ff;
  color: #002fa7;
  font-size: 12px;
}
.admin-change-drawer section {
  margin: 24px 0;
}
.admin-change-drawer section h3 {
  font-size: 12px;
  color: #6b7280;
}
.admin-change-drawer section > button {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  text-align: left;
  margin: 8px 0;
}
.admin-change-drawer section > button b,
.admin-change-drawer section > button span {
  grid-column: 1;
}
.admin-change-drawer section > button span {
  font-size: 11px;
  color: #6b7280;
  margin-top: 4px;
}
.admin-change-drawer section > button i {
  grid-column: 2;
  grid-row: 1/3;
  align-self: center;
  font-style: normal;
  color: #002fa7;
  font-size: 11px;
}
.admin-change-drawer section > div {
  display: flex;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid #f0f1f4;
  font-size: 12px;
}
.admin-change-drawer time {
  color: #8a91a0;
}
.admin-change-drawer > footer {
  position: sticky;
  bottom: -24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 14px 0 24px;
  background: #fff;
}
.admin-modified-badge {
  display: inline-block;
  margin-left: 10px;
  color: #002fa7;
  font-size: 11px;
  font-style: normal;
}
.admin-tab-dot {
  margin-left: 6px;
  color: #002fa7;
  font-size: 8px;
  font-style: normal;
}
.layout-page {
  position: relative;
}
.layout-resize-preview {
  position: absolute;
  z-index: 20;
  pointer-events: none;
  border: 2px dashed #002fa7;
  background: #002fa710;
  box-shadow: 0 0 0 1px #fff8;
  transition:
    left 0.06s linear,
    width 0.06s linear;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 8px;
  color: #002fa7;
}
.layout-resize-preview b,
.layout-resize-preview span {
  padding: 4px 7px;
  border-radius: 4px;
  background: #fff;
  font-size: 10px;
  box-shadow: 0 2px 8px #1b2b5524;
}
.layout-resize-preview span {
  font-variant-numeric: tabular-nums;
}
.layout-workbench:has(.layout-resize-preview) {
  user-select: none;
}

/* Whole-page editing workspace */
.page-builder {
  display: grid;
  grid-template-columns: 180px minmax(560px, 1fr) 260px;
  align-items: start;
  min-height: 720px;
  background: #eef0f4;
  border: 1px solid #e0e3e9;
}
.page-outline,
.page-properties {
  position: sticky;
  top: 136px;
  box-sizing: border-box;
  max-height: calc(100vh - 152px);
  overflow-y: auto;
  background: #fff;
  padding: 18px 14px;
}
.page-outline {
  border-right: 1px solid #dde1e8;
}
.page-outline header,
.page-properties header {
  display: grid;
  gap: 5px;
  margin-bottom: 18px;
}
.page-outline header span,
.page-properties header span {
  font-size: 11px;
  color: #8a91a0;
}
.page-outline > button {
  width: 100%;
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: center;
  gap: 6px;
  padding: 10px 8px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #3b4250;
  text-align: left;
}
.page-outline > button.active {
  color: #002fa7;
  background: #eef3ff;
}
.page-outline i {
  color: #a5aab4;
  font-style: normal;
}
.page-outline small {
  font-size: 10px;
  color: #949aa6;
}
.page-stage {
  min-width: 0;
  padding: 0 26px 52px;
  overflow: auto;
}
.page-stage-bar {
  position: sticky;
  top: 0;
  z-index: 8;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #eef0f4ef;
  backdrop-filter: blur(8px);
}
.page-stage-bar > span {
  font-size: 11px;
  letter-spacing: 0.12em;
  color: #737986;
}
.page-stage-bar nav {
  display: flex;
  gap: 4px;
}
.page-stage-bar button {
  padding: 5px 7px;
  border: 0;
  background: transparent;
  font-size: 10px;
}
.page-stage-bar button.active {
  color: #002fa7;
  box-shadow: inset 0 -1px #002fa7;
}
.page-document {
  max-width: 820px;
  margin: 0 auto;
  overflow: hidden;
  background: #f7f4ed;
  box-shadow: 0 16px 45px #1a23311a;
}
.page-document section {
  position: relative;
  outline: 1px solid transparent;
  outline-offset: -1px;
  transition:
    outline-color 0.15s,
    background 0.15s;
}
.page-document section:hover {
  outline-color: #002fa766;
}
.page-document section.selected {
  outline: 2px solid #002fa7;
  z-index: 2;
}
.page-document input,
.page-document textarea {
  width: 100%;
  border: 1px solid transparent;
  border-radius: 2px;
  background: transparent;
  color: inherit;
  font: inherit;
  resize: vertical;
}
.page-document input:hover,
.page-document textarea:hover,
.page-document input:focus,
.page-document textarea:focus {
  border-color: #002fa788;
  outline: 0;
  background: #fff7;
}
.page-hero {
  aspect-ratio: 16/9;
  background: #141414;
  color: #fff;
}
.page-hero img,
.page-hero video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero > span {
  position: absolute;
  left: 22px;
  bottom: 18px;
  font-size: 9px;
  letter-spacing: 0.18em;
}
.page-placeholder {
  display: grid;
  height: 100%;
  place-items: center;
  color: #888;
}
.page-identity,
.page-intro,
.page-story,
.page-gallery,
.page-footer-preview {
  padding: 44px 7%;
}
.page-title {
  font-family: Georgia, serif !important;
  font-size: clamp(30px, 5vw, 62px) !important;
  line-height: 1.08 !important;
}
.page-en {
  margin-top: 6px;
  color: #777 !important;
  font-size: 14px !important;
  letter-spacing: 0.12em;
}
.page-identity > div {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 34px;
  border-top: 1px solid #c9c4ba;
  padding-top: 16px;
}
.page-identity > div input {
  font-size: 11px;
  text-transform: uppercase;
}
.page-intro,
.page-story {
  display: grid;
  grid-template-columns: 1fr 2.5fr;
  gap: 28px;
  background: #fff;
}
.page-intro > span {
  font-size: 9px;
  letter-spacing: 0.16em;
}
.page-intro textarea {
  min-height: 95px;
  font-family: Georgia, serif;
  font-size: 21px;
  line-height: 1.65;
}
.page-story > input {
  font-size: 20px;
  font-weight: 600;
}
.page-story > textarea,
.page-story > button {
  grid-column: 2;
}
.page-story textarea {
  min-height: 84px;
  color: #555;
  line-height: 1.8;
}
.page-story > button {
  justify-self: start;
  border: 0;
  background: transparent;
  color: #002fa7;
}
.page-gallery header {
  display: grid;
  grid-template-columns: 1fr 2.5fr;
  gap: 28px;
  margin-bottom: 26px;
}
.page-gallery header span {
  font-size: 9px;
  letter-spacing: 0.16em;
}
.page-gallery header textarea {
  min-height: 58px;
}
.page-gallery > div {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 10px;
}
.page-gallery > div button {
  position: relative;
  padding: 0;
  border: 2px solid transparent;
  background: #ddd;
  overflow: hidden;
}
.page-gallery > div button.active {
  border-color: #002fa7;
}
.page-gallery img {
  display: block;
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
}
.page-gallery > div button > span {
  position: absolute;
  left: 7px;
  bottom: 6px;
  padding: 2px 4px;
  color: #fff;
  background: #0008;
  font-size: 9px;
}
.page-add-media {
  display: block;
  margin-top: 12px;
  padding: 18px;
  border: 1px dashed #aeb4bf;
  color: #002fa7;
  text-align: center;
  cursor: pointer;
}
.page-add-media input,
.cms-upload input {
  display: none;
}
.page-footer-preview {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  min-height: 140px;
  background: #151515;
  color: #fff;
}
.page-footer-preview b {
  font-size: 27px;
  letter-spacing: 0.08em;
}
.page-footer-preview span {
  color: #aaa;
  font-size: 10px;
}
.page-properties {
  border-left: 1px solid #dde1e8;
}
.page-property {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}
.page-property > span {
  font-size: 11px;
  color: #616875;
}
.page-property input,
.page-property textarea,
.page-property select {
  width: 100%;
  box-sizing: border-box;
  padding: 9px;
  border: 1px solid #d6dae2;
  background: #fff;
}
.page-property textarea {
  min-height: 96px;
  resize: vertical;
}
.page-prop-preview {
  width: 100%;
  max-height: 150px;
  margin-bottom: 12px;
  object-fit: cover;
}
.page-properties .cms-upload {
  display: block;
  margin-bottom: 8px;
  padding: 10px;
  background: #002fa7;
  color: #fff;
  text-align: center;
  cursor: pointer;
}
.page-properties .cms-upload.secondary {
  background: #edf1f8;
  color: #25304c;
}
.page-prop-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.admin-work-tabs {
  position: sticky;
  z-index: 24;
  top: 78px;
  background: rgba(247, 248, 250, 0.96);
  backdrop-filter: blur(10px);
}
.page-advanced-layout {
  border: 1px solid #dde1e8;
  background: #fff;
}
.page-advanced-layout > summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  cursor: pointer;
  list-style: none;
}
.page-advanced-layout > summary::-webkit-details-marker {
  display: none;
}
.page-advanced-layout > summary::after {
  content: "+";
  grid-column: 3;
  font-size: 22px;
  color: #002fa7;
}
.page-advanced-layout[open] > summary::after {
  content: "−";
}
.page-advanced-layout > summary span {
  color: #7b8290;
  font-size: 11px;
}
.page-advanced-layout > .layout-workbench {
  padding: 20px;
  border-top: 1px solid #e5e7eb;
}

/* Safe AI draft assistant */
.admin-ai-trigger {
  color: #002fa7 !important;
  border-color: #002fa755 !important;
  background: #fff !important;
  font-family:
    Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif !important;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.admin-ai-drawer {
  position: fixed;
  z-index: 110;
  top: 0;
  right: 0;
  width: min(430px, 94vw);
  height: 100vh;
  box-sizing: border-box;
  overflow-y: auto;
  padding: 25px;
  background: #fff;
  box-shadow: -20px 0 50px #15213d24;
}
.admin-ai-drawer > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.admin-ai-drawer > header span {
  color: #002fa7;
  font-size: 10px;
  letter-spacing: 0.15em;
}
.admin-ai-drawer > header h2 {
  margin: 5px 0 0;
}
.admin-ai-drawer > header button {
  border: 0;
  background: transparent;
  font-size: 25px;
}
.admin-ai-safety {
  padding: 12px;
  background: #f0f4ff;
  color: #45516d;
  font-size: 12px;
  line-height: 1.65;
}
.admin-ai-context {
  display: grid;
  gap: 5px;
  padding: 16px 0;
  border-bottom: 1px solid #eaecf0;
}
.admin-ai-context span,
.admin-ai-context small {
  color: #8a91a0;
  font-size: 11px;
}
.admin-ai-presets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin: 16px 0;
}
.admin-ai-presets button {
  padding: 9px;
  border: 1px solid #dfe3eb;
  background: #fff;
  text-align: left;
}
.admin-ai-prompt {
  display: grid;
  gap: 7px;
  font-size: 11px;
  color: #626a78;
}
.admin-ai-prompt textarea {
  min-height: 100px;
  padding: 11px;
  border: 1px solid #cfd4dd;
  resize: vertical;
}
.admin-ai-analyze,
.admin-ai-patches button,
.admin-ai-empty button {
  width: 100%;
  margin-top: 10px;
  padding: 11px;
  border: 0;
  background: #002fa7;
  color: #fff;
}
.admin-ai-result {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #e2e5eb;
}
.admin-ai-mode {
  display: inline-block;
  padding: 4px 7px;
  border-radius: 20px;
  background: #eef3ff;
  color: #002fa7;
  font-size: 10px;
}
.admin-ai-result h3 {
  line-height: 1.5;
}
.admin-ai-result li {
  margin-bottom: 7px;
  color: #555d6d;
  font-size: 12px;
  line-height: 1.55;
}
.admin-ai-patches article {
  margin-top: 8px;
  padding: 9px;
  background: #f6f7f9;
}
.admin-ai-patches code {
  color: #002fa7;
  font-size: 10px;
}
.admin-ai-patches p {
  margin: 5px 0 0;
  font-size: 11px;
}
.admin-ai-empty {
  padding: 40px 0;
  text-align: center;
}
@media (max-width: 1250px) {
  .page-builder {
    grid-template-columns: 140px minmax(500px, 1fr);
  }
  .page-properties {
    position: static;
    max-height: none;
    grid-column: 1/-1;
    border-top: 1px solid #dde1e8;
    border-left: 0;
  }
}
@media (max-width: 820px) {
  .page-builder {
    display: block;
  }
  .page-outline {
    display: none;
  }
  .admin-work-tabs {
    top: 0;
  }
  .page-stage {
    padding-inline: 10px;
  }
  .page-intro,
  .page-story,
  .page-gallery header {
    grid-template-columns: 1fr;
  }
  .page-story > textarea,
  .page-story > button {
    grid-column: 1;
  }
}

/* Folder-based bulk importer */
.batch-guide {
  display: grid;
  grid-template-columns: 1fr 1.5fr auto;
  gap: 24px;
  align-items: center;
  padding: 22px;
}
.batch-guide > div {
  display: grid;
  gap: 8px;
}
.batch-guide code {
  color: #002fa7;
  font-size: 11px;
}
.batch-guide p {
  margin: 0;
  color: #707785;
  font-size: 12px;
  line-height: 1.6;
}
.batch-picker {
  padding: 11px 16px;
  background: #002fa7;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
}
.batch-summary {
  position: sticky;
  z-index: 12;
  top: 78px;
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 16px 0;
  padding: 13px 16px;
  border: 1px solid #dfe3ea;
  background: #fffffff2;
  backdrop-filter: blur(10px);
}
.batch-summary span {
  color: #656c79;
  font-size: 11px;
}
.batch-summary button {
  margin-left: auto;
  padding: 9px 14px;
  border: 0;
  background: #002fa7;
  color: #fff;
}
.batch-list {
  display: grid;
  gap: 10px;
}
.batch-list article {
  display: grid;
  grid-template-columns: 90px minmax(220px, 1fr) minmax(260px, 1.4fr);
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid #e1e4e9;
  background: #fff;
}
.batch-list article.is-off {
  opacity: 0.45;
}
.batch-list article > label {
  display: flex;
  gap: 7px;
  align-items: center;
  color: #002fa7;
  font-size: 11px;
}
.batch-list h3,
.batch-list p {
  margin: 0 0 6px;
}
.batch-list p,
.batch-list small,
.batch-list li {
  color: #777e8a;
  font-size: 11px;
}
.batch-list ul {
  margin: 0;
  padding-left: 18px;
}
@media (max-width: 900px) {
  .batch-guide,
  .batch-list article {
    grid-template-columns: 1fr;
  }
  .batch-summary {
    flex-wrap: wrap;
    top: 0;
  }
}
.admin-nav-groups{display:grid!important;gap:18px}.admin-nav-groups section{display:grid;gap:4px}.admin-nav-groups section>small{padding:0 13px 5px;color:#a4a9b3;font-size:8px;letter-spacing:.13em}.admin-account-page{display:grid;gap:16px}.admin-account-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:4px}.admin-account-head span{color:#002fa7;font-size:9px;letter-spacing:.16em}.admin-account-head h1{margin:7px 0 4px;font-size:30px}.admin-account-head p{margin:0;color:#858b96;font-size:10px}.admin-account-head>b{padding:8px 11px;border-radius:15px;background:#edf1ff;color:#002fa7;font-size:9px}.admin-account-create{padding:22px}.admin-account-form{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:16px 0}.admin-account-create .is-primary{border:0;border-radius:7px;padding:11px 16px;background:#002fa7;color:#fff}.admin-account-message{margin:0;color:#5c6572;font-size:10px}.admin-account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.admin-member-card{padding:20px}.admin-member-card header{display:flex;align-items:center;gap:11px}.admin-member-card header>i{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#edf1ff;color:#002fa7;font-style:normal}.admin-member-card header>div{display:grid;gap:3px}.admin-member-card h3{margin:0;font-size:13px}.admin-member-card header span{color:#949aa4;font-size:9px}.admin-member-card header>b{margin-left:auto;padding:5px 8px;border-radius:12px;background:#e9f5ee;color:#357651;font-size:8px}.admin-member-card header>b.is-off{background:#f5e9eb;color:#a14957}.admin-member-card dl{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}.admin-member-card dl div{display:grid;gap:4px}.admin-member-card dt{color:#9aa0aa;font-size:8px}.admin-member-card dd{margin:0;color:#4f5662;font-size:9px;overflow-wrap:anywhere}.admin-member-card footer{display:flex;gap:7px;padding-top:14px;border-top:1px solid #eef0f3}.admin-member-card footer button,.admin-member-card footer select{min-width:0;border:1px solid #dfe2e8;border-radius:6px;padding:7px;background:#fff;color:#555d68;font-size:8px}.admin-password-reset{margin-top:2px;padding:20px}.admin-session-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-top:1px solid #eceff3}.admin-session-row div{display:grid;gap:5px}.admin-session-row span{color:#888f9a;font-size:9px}.admin-audit-list{margin-top:18px}.admin-audit-list article{display:grid;grid-template-columns:150px 110px minmax(0,1fr) 170px;gap:14px;padding:12px 0;border-top:1px solid #edf0f3;font-size:9px}.admin-audit-list time,.admin-audit-list small{color:#8f959f}.admin-page-cards,.admin-role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.admin-page-cards button{padding:25px;border:1px solid #e1e4ea;text-align:left;display:grid;gap:10px;cursor:pointer}.admin-page-cards button>b,.admin-role-grid b{font-size:15px}.admin-page-cards button>span,.admin-role-grid p{color:#7f8692;font-size:10px;line-height:1.6}.admin-page-cards button>i{color:#002fa7;font-size:9px;font-style:normal}.admin-role-grid article{padding:22px}.admin-role-grid article>span{display:inline-block;padding:5px 8px;border-radius:10px;background:#edf1ff;color:#002fa7;font-size:8px}@media(max-width:1100px){.admin-account-form{grid-template-columns:repeat(2,1fr)}.admin-account-grid{grid-template-columns:1fr}}@media(max-width:700px){.admin-page-cards,.admin-role-grid{grid-template-columns:1fr}.admin-audit-list article{grid-template-columns:1fr;gap:4px}}

/* 2.1: per-language typography and a preview sized to its own canvas. */
.page-document { container-type: inline-size; }
.page-document .page-title {
  display: block; height: auto; min-height: 2.4em; overflow-wrap: anywhere;
  white-space: pre-wrap; font-size: min(var(--work-title, 44px), 7cqw) !important;
  line-height: 1.2 !important; letter-spacing: -.025em;
}
.page-document .page-en { font-size: var(--work-english, 14px) !important; line-height: 1.5; letter-spacing: .02em; }
.page-document .page-intro textarea { font-size: var(--work-intro, 18px); line-height: 1.65; }
.page-document .page-story-title { grid-column: 1 / -1; font-size: var(--work-storyTitle, 28px); line-height: 1.35; font-weight: 600; min-height: 2.8em; }
.page-document .page-story textarea:not(.page-story-title),
.page-document .page-gallery header textarea { font-size: var(--work-body, 16px); line-height: 1.75; }
.page-typography { border: 1px solid #e1e5ed; border-radius: 8px; padding: 12px; margin: 18px 0; display: grid; gap: 9px; }
.page-typography legend { color: #002fa7; font-size: 12px; padding: 0 5px; }
.page-typography p { color: #737b88; font-size: 11px; line-height: 1.6; margin: 0; }
.page-typography .page-property { display: grid; grid-template-columns: minmax(0,1fr) 68px; align-items: center; gap: 8px; }
.page-typography input { width: 100%; min-width: 0; }
.page-typography button { border: 1px solid #dce2ee; background: #f5f7ff; color: #002fa7; padding: 9px; border-radius: 6px; }
@media(max-width:700px) {
  .page-document .page-title { font-size: min(var(--work-titleMobile, 28px), 9cqw) !important; }
  .page-intro, .page-story, .page-gallery header { grid-template-columns: 1fr; gap: 16px; }
  .page-story > textarea, .page-story > button { grid-column: 1; }
}
/* 2.2.0 — direct file drops and asset references */
.file-drop { position: relative; }
.file-drop.is-file-over { outline: 3px dashed #002fa7; outline-offset: -3px; }
.file-drop-overlay { position:absolute;inset:0;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(235,241,255,.94);color:#002fa7;pointer-events:none;padding:20px;text-align:center; }
.file-drop-overlay b{font-size:22px}.file-drop-overlay span{font-size:13px;line-height:1.6}
.page-drop-error{grid-column:1/-1;padding:14px;background:#fff1ee;color:#a43723;border:1px solid #f0c8c0;display:flex;justify-content:space-between;gap:20px}
.page-media-name{font-size:11px;overflow-wrap:anywhere;line-height:1.6;color:#697183}
.asset-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.asset-actions button,.asset-actions a,.asset-pagination button{border:1px solid #dce2ee;border-radius:6px;background:#fff;color:#002fa7;padding:9px 12px;text-decoration:none;font-size:12px;cursor:pointer}
.asset-manager{display:grid;gap:18px}.asset-manager button:disabled{opacity:.45;cursor:default}.asset-manager .admin-heading{gap:16px;flex-wrap:wrap}.asset-error{padding:12px;background:#fff1ee;color:#a43723}.asset-scan-status{font-size:12px;line-height:1.7;color:#687080}
.asset-filters{display:grid;grid-template-columns:2fr 1fr;gap:16px}.asset-filters label,.asset-card label{display:grid;gap:7px;font-size:12px;color:#687080}.asset-filters input,.asset-filters select,.asset-card input{width:100%;min-width:0;border:1px solid #dbe0e8;border-radius:6px;padding:10px;background:#fff;color:#252b35}
.asset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.asset-card{min-width:0;background:#fff;border:1px solid #e0e4ec;border-radius:10px;overflow:hidden}.asset-preview{aspect-ratio:16/10;background:#e9ecf2;display:grid;place-items:center}.asset-preview img,.asset-preview video{width:100%;height:100%;object-fit:contain;min-height:0}.asset-card-body{display:grid;gap:12px;padding:16px}.asset-card-body>b,.asset-card code{overflow-wrap:anywhere;font-size:13px}.asset-card code{background:#f5f6f9;padding:9px;font-size:11px}.asset-status{font-size:11px;color:#2f5a3d}.asset-status.candidate{color:#9a5f11}.asset-status.review,.asset-status.pending{color:#9e432d}.asset-card small{font-size:11px;color:#858c98}.asset-card summary{font-size:12px;cursor:pointer}.asset-reference{display:grid;gap:7px;padding:12px 0;border-top:1px solid #edf0f5;font-size:12px}.asset-reference button{justify-self:start;background:#edf1ff;border:0;padding:6px 9px;border-radius:5px;color:#002fa7}.asset-pagination{display:flex;justify-content:flex-end;gap:12px;align-items:center;font-size:12px}
@media(max-width:1150px){.asset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.asset-grid,.asset-filters{grid-template-columns:1fr}.file-drop-overlay b{font-size:16px}}

/* 2.3.1: keep workflow guidance outside the editor's three-column flow. */
.page-category-guide {
  grid-column: 1 / -1;
  min-width: 0;
  padding: 18px 22px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 24px;
  border-bottom: 1px solid #dde1e8;
  background: #f8faff;
  font-size: 13px;
  line-height: 1.65;
}
.page-category-guide > div { flex: 1 1 280px; min-width: 0; }
.page-category-guide b { font-size: 14px; }
.page-category-guide p { margin: 4px 0 0; color: #616875; }
.page-category-guide > p { flex-basis: 100%; font-size: 12px; }
.page-category-guide nav { display: flex; flex-wrap: wrap; gap: 8px; }
.page-category-guide button { padding: 8px 12px; font-size: 12px; white-space: nowrap; }
.page-category-guide a { margin-left: 12px; color: #002fa7; }
.page-builder { min-width: 0; grid-template-columns: 160px minmax(0, 1fr) 280px; }
.page-outline, .page-properties { min-width: 0; }
.page-stage-bar { height: auto; min-height: 54px; flex-wrap: wrap; gap: 8px; padding-block: 8px; }
.page-stage-bar nav { flex-wrap: wrap; }
.page-stage-bar button { white-space: nowrap; flex-shrink: 0; }
.admin-create-actions, .admin-category-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-create-actions button { white-space: nowrap; }
.admin-category-tabs { margin-bottom: 14px; }
.admin-category-tabs .is-active { color: white; border-color: #002fa7; background: #002fa7; }
.admin-category-tabs small { margin-left: 8px; font-size: 11px; }
.admin-category-help { margin-bottom: 20px; padding: 14px 16px; background: #eef3ff; border-radius: 8px; font-size: 13px; line-height: 1.7; }
.admin-category-help p { margin: 0 0 6px; }
.admin-category-help a { color: #002fa7; }
.admin-category-badge { display: inline-block; margin: 4px 0; padding: 3px 8px; border-radius: 20px; background: #eef3ff; color: #002fa7; font-size: 11px; }
@media (max-width: 1400px) {
  .page-builder { grid-template-columns: 140px minmax(0, 1fr); }
  .page-properties { position: static; max-height: none; grid-column: 1 / -1; border-top: 1px solid #dde1e8; border-left: 0; }
}
@media (max-width: 820px) {
  .page-builder { display: block; }
  .page-category-guide { padding: 14px; }
  .page-category-guide nav { width: 100%; }
  .page-category-guide button { white-space: normal; }
  .page-stage { padding-inline: 10px; }
  .page-identity > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-category-guide a { margin-left: 0; display: block; }
}

.photo-module-editor { grid-column: 1 / -1; padding: 22px; background: #fff; border-bottom: 1px solid #dde1e8; min-width: 0; }
.photo-module-editor > header,.photo-module-card > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.photo-module-editor h2 { margin: 0; font-size: 18px; }
.photo-module-editor p { color: #687080; font-size: 12px; line-height: 1.8; }
.photo-module-editor fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.photo-module-add { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.photo-module-card { border: 1px solid #dde1e8; border-radius: 8px; padding: 18px; margin-top: 14px; font-size: 13px; }
.photo-module-card header div { display: flex; gap: 6px; }
.photo-module-card button { padding: 7px 10px; font-size: 12px; }
.photo-module-card label { display: block; line-height: 1.8; }
.photo-module-fields { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 16px; margin: 14px 0; }
.photo-module-fields input,.photo-module-fields select,.photo-module-card textarea { width: 100%; min-width: 0; padding: 9px; border: 1px solid #ccd4e8; border-radius: 5px; font: inherit; }
.photo-module-picker { display: grid; grid-template-columns: repeat(auto-fill,minmax(90px,1fr)); gap: 10px; margin-top: 14px; }
.photo-module-picker label { position: relative; border: 1px solid #dde1e8; padding: 5px; }
.photo-module-picker img { width: 100%; height: 90px; object-fit: contain; }
.photo-module-image-order { padding-left: 20px; }
.photo-module-image-order li { margin: 6px 0; }
.photo-module-image-order span { display: inline-block; max-width: 65%; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media(max-width:700px) { .photo-module-editor { padding: 14px; } .photo-module-fields { grid-template-columns: 1fr; } }

/* Photography uses one continuous page, independent of the film drawer. */
.photo-project { position: fixed; inset: 0; z-index: 900; overflow: auto; background: #f7f7f2; color: #101116; overscroll-behavior: contain; scroll-behavior: smooth; }
.photo-toolbar { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 4vw; background: rgba(247,247,242,.96); border-bottom: 1px solid #ddd; font: 12px/1.5 Arial,sans-serif; letter-spacing: .08em; }
.photo-project button { cursor: pointer; }
.photo-toolbar button,.photo-project-footer button { border: 0; background: transparent; color: #002fa7; padding: 8px; font: inherit; }
.photo-project-heading { padding: 70px 7vw 45px; }
.photo-project-heading p { font-size: var(--work-english,14px); line-height: 1.7; color: #687080; }
.photo-project-heading h1 { max-width: 1100px; margin: 18px 0; font-size: var(--work-title,48px); font-weight: 400; line-height: 1.15; overflow-wrap: anywhere; }
.photo-chapters { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 7vw 36px; }
.photo-chapters button { padding: 10px 14px; border: 1px solid #ccd4e8; border-radius: 30px; color: #002fa7; background: transparent; font-size: 12px; line-height: 1.5; }
.photo-chapters small { margin-right: 10px; opacity: .6; }
.photo-chapters button.is-active { background: #002fa7; color: white; }
.photo-modules { max-width: 1800px; margin: auto; padding: 0 7vw; }
.photo-module { padding: 45px 0 65px; border-top: 1px solid #ddd; scroll-margin-top: 80px; min-width: 0; }
.photo-module > header { display: flex; gap: 20px; align-items: baseline; margin-bottom: 24px; }
.photo-module > header > span { color: #002fa7; font: 11px Arial,sans-serif; }
.photo-module h2 { margin: 0; font-size: var(--work-storyTitle,28px); font-weight: 400; line-height: 1.35; overflow-wrap: anywhere; }
.photo-module-copy { max-width: 800px; margin-bottom: 28px; font-size: var(--work-body,16px); line-height: 1.9; overflow-wrap: anywhere; white-space: pre-wrap; }
.photo-module-copy p { margin: 0 0 16px; }
.photo-module-images { display: grid; grid-template-columns: minmax(0,1fr); gap: 28px; }
.photo-layout-grid .photo-module-images { grid-template-columns: repeat(2,minmax(0,1fr)); }
.photo-module figure { min-width: 0; margin: 0; }
.photo-module img { width: 100%; height: auto; display: block; }
.photo-module figcaption { margin-top: 10px; font-size: 11px; line-height: 1.6; color: #687080; }
.photo-layout-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.8fr); gap: 24px 50px; }
.photo-layout-split > header { grid-column: 1 / -1; }
.photo-layout-split .photo-module-copy { grid-column: 1; }
.photo-layout-split .photo-module-images { grid-column: 2; }
.photo-project-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 40px 7vw; font-size: 12px; border-top: 1px solid #ddd; }
.photo-project.is-embedded { position: relative; inset: auto; z-index: 0; height: 70vh; border: 1px solid #ddd; }
@media(max-width:700px) {
 .photo-project-heading { padding: 36px 20px 24px; }
 .photo-project-heading h1 { font-size: var(--work-titleMobile,28px); }
 .photo-chapters { padding: 0 20px 25px; }
 .photo-modules { padding-inline: 20px; }
 .photo-module { padding-block: 30px; }
 .photo-layout-grid .photo-module-images { grid-template-columns: minmax(0,1fr); }
 .photo-layout-split { display: block; }
 .photo-project-footer { padding-inline: 20px; }
}

.photo-module-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }

/* Full-resolution image viewer */
.image-zoom-trigger,.image-static-protected{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:inherit}
.image-zoom-trigger{cursor:zoom-in}
.image-static-protected{cursor:default}
.image-zoom-hint{position:absolute;right:14px;top:14px;z-index:4;padding:8px 10px;border:1px solid rgba(255,255,255,.5);background:rgba(0,0,0,.26);color:#fff;font-size:8px;letter-spacing:.12em;line-height:1;backdrop-filter:blur(10px);opacity:0;transform:translateY(4px);transition:opacity .25s ease,transform .25s ease}
.image-zoom-trigger:hover>.image-zoom-hint,.image-zoom-trigger:focus-visible>.image-zoom-hint{opacity:1;transform:none}
.image-zoom-hero{height:100%}
.image-watermark-layer{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none;user-select:none}
.image-watermark-layer i{position:absolute;right:14px;bottom:14px;display:block;color:rgba(255,255,255,.32);font:500 9px/1 Arial,sans-serif;letter-spacing:.1em;text-align:right;text-shadow:0 1px 3px rgba(0,0,0,.45);white-space:nowrap}
.image-lightbox{position:fixed;inset:0;z-index:20000;display:grid;place-items:center;background:rgba(5,5,8,.96);color:#fff;overscroll-behavior:contain;touch-action:pan-y}
.image-lightbox figure{position:relative;display:flex;align-items:center;justify-content:center;width:calc(100vw - 160px);height:calc(100svh - 120px);margin:0}
.image-lightbox img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}
.image-lightbox figcaption{position:fixed;left:24px;right:24px;bottom:18px;display:flex;justify-content:space-between;gap:30px;color:rgba(255,255,255,.72);font-size:9px;letter-spacing:.1em;pointer-events:none}
.image-lightbox figcaption p{margin:0;text-align:right}
.image-lightbox button{position:fixed;z-index:2;border:0;background:transparent;color:#fff;cursor:pointer}
.image-lightbox-close{top:18px;right:22px;padding:12px;font-size:10px;letter-spacing:.12em}
.image-lightbox-prev,.image-lightbox-next{top:50%;width:56px;height:72px;margin-top:-36px;font-size:26px}
.image-lightbox-prev{left:10px}.image-lightbox-next{right:10px}
.image-lightbox-loading{position:absolute;color:rgba(255,255,255,.55);font-size:10px;letter-spacing:.12em}
@media(max-width:700px){
  .image-zoom-hint{opacity:1;right:10px;top:10px}
  .image-watermark-layer i{right:10px;bottom:10px;font-size:8px}
  .image-lightbox figure{width:100vw;height:calc(100svh - 110px)}
  .image-lightbox-prev,.image-lightbox-next{top:auto;bottom:35px;width:52px;height:52px;background:rgba(255,255,255,.08)}
  .image-lightbox-prev{left:14px}.image-lightbox-next{right:14px}
  .image-lightbox figcaption{left:78px;right:78px;bottom:48px;justify-content:center}
  .image-lightbox figcaption p{display:none}
}
@media(prefers-reduced-motion:reduce){.image-zoom-trigger>span{transition:none}}

/* One visual workspace per media type. */
.layout-workbench { border: 0; margin: 0; padding: 0; min-width: 0; }
.page-builder.is-gallery-workspace { grid-template-columns: 150px minmax(0,1fr); }
.page-builder.is-gallery-workspace > .page-properties { display: none; }
.video-gallery-workspace { min-width: 0; padding: 16px 0; }
.video-gallery-workspace > label { display: grid; gap: 6px; margin-bottom: 16px; font-size: 12px; }
.video-gallery-workspace textarea { width: 100%; border: 1px solid #dce2ee; padding: 12px; border-radius: 6px; }
.video-gallery-workspace .layout-columns { grid-template-columns: 110px minmax(0,1fr) 220px; }
.video-gallery-workspace .layout-assets,.video-gallery-workspace .layout-inspector { position: static; max-height: none; }
.photo-studio { border: 1px solid #dde1e8; background: #eef0f4; min-width: 0; }
.studio-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:14px; padding:18px; background:#fff; border-bottom:1px solid #dde1e8; }
.studio-toolbar b { font-size:16px; }.studio-toolbar p,.studio-outline p { margin:6px 0; font-size:12px; line-height:1.7; color:#687080; }
.studio-toolbar nav { display:flex; flex-wrap:wrap; gap:6px; }.studio-toolbar button { font-size:12px; padding:8px 10px; }
.studio-toolbar .active { background:#002fa7; color:white; }
.studio-project-settings { background:#fff; padding:16px 18px; border-bottom:1px solid #dde1e8; }
.studio-project-settings summary { cursor:pointer; font-size:13px; color:#002fa7; }
.studio-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px; }
.studio-fields label { display:grid; gap:6px; font-size:12px; }.studio-fields input,.studio-fields select { min-width:0; width:100%; padding:9px; border:1px solid #dce2ee; border-radius:5px; }.studio-fields img { max-width:150px; max-height:90px; object-fit:contain; }
.photo-studio fieldset { border:0; padding:0; margin:0; min-width:0; }
.studio-columns { display:grid; grid-template-columns:200px minmax(0,1fr); align-items:start; }
.studio-outline { position:sticky; top:110px; max-height:calc(100vh - 120px); overflow:auto; background:#fff; padding:16px; }
.studio-outline h3 { font-size:14px; margin:0; }.studio-outline-item { border:1px solid #e1e5ee; border-radius:6px; margin:10px 0; padding:6px; }.studio-outline-item.active { border-color:#002fa7; background:#edf2ff; }
.studio-outline button { font-size:12px; padding:7px; }.studio-module-select { width:100%; border:0; text-align:left; background:transparent; line-height:1.6; }
.studio-outline-item > div { display:flex; justify-content:flex-end; gap:4px; }.studio-outline select { width:100%; margin:14px 0 8px; font-size:12px; padding:8px; }.studio-outline fieldset > button { width:100%; margin-bottom:8px; }
.studio-stage { min-width:0; padding:18px; }.studio-module-copy { background:#fff; padding:22px!important; }
.studio-module-copy header { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:18px; font-size:12px; color:#687080; }
.studio-module-copy .studio-module-title { width:100%; border:0; border-bottom:1px dashed #dce2ee; padding:12px 0; font-size:26px; color:#151922; background:transparent; }
.studio-module-copy textarea { width:100%; border:0; border-bottom:1px dashed #dce2ee; padding:16px 0; font-size:15px; line-height:1.8; resize:vertical; }
.studio-module-copy > label { display:block; margin-top:12px; font-size:12px; }.studio-module-copy select { margin-left:12px; padding:8px; }
.studio-existing-assets { background:#fff; padding:14px; font-size:12px; }.studio-existing-assets summary { cursor:pointer; color:#002fa7; }
.studio-upload-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:16px 0; font-size:12px; color:#687080; }.studio-upload-row label { display:inline-flex; border:1px solid #ccd4e8; background:white; padding:10px; border-radius:6px; color:#002fa7; cursor:pointer; }.studio-upload-row input { max-width:180px; margin-left:8px; font-size:11px; }
.photo-studio .layout-assets { display:none; }.photo-studio .layout-columns { grid-template-columns:minmax(0,1fr) 240px; }.photo-studio .layout-inspector { position:static; max-height:none; }
.photo-studio .layout-canvas,.video-gallery-workspace .layout-canvas { min-width:0; padding:16px; }.photo-studio .layout-page,.video-gallery-workspace .layout-page { min-width:0!important; }
.photo-studio .layout-empty { padding:50px 20px; }.studio-empty { padding:70px 20px; color:#687080; }
@media(max-width:1200px) {
 .photo-studio .layout-columns,.video-gallery-workspace .layout-columns { grid-template-columns:minmax(0,1fr); }
 .video-gallery-workspace .layout-assets { position:static; max-height:none; }
 .studio-columns { grid-template-columns:170px minmax(0,1fr); }
}
@media(max-width:820px) {
 .studio-columns { display:block; }.studio-outline { position:static; max-height:280px; }.studio-fields { grid-template-columns:minmax(0,1fr); }.studio-stage { padding:10px; }
 .page-builder.is-gallery-workspace { display:block; }
}

/* Shared canvas geometry: identical values in the editor and public pages. */
.photo-module-images,.photo-layout-grid .photo-module-images { grid-template-columns: repeat(12,minmax(0,1fr)); align-items: start; }
.photo-module .photo-layout-image { grid-column: var(--gallery-column); margin-top: var(--gallery-space); }
.photo-layout-image img { aspect-ratio: var(--gallery-ratio); object-fit: var(--gallery-fit); object-position: var(--gallery-position); }
@media(max-width:700px) {
 .photo-module-images,.photo-layout-grid .photo-module-images { grid-template-columns: repeat(12,minmax(0,1fr)); }
 .photo-module .photo-layout-image { grid-column: auto / span var(--gallery-mobile-span,12); margin-top: var(--gallery-mobile-space,0px); }
}
.photo-studio .studio-module-title { font-size:var(--work-storyTitle,28px); }
.photo-studio .studio-module-copy textarea { font-size:var(--work-body,16px); }
.page-gallery > div > button { grid-column:var(--gallery-column); margin-top:var(--gallery-space); }
.page-gallery > div > button img { aspect-ratio:var(--gallery-ratio); object-fit:var(--gallery-fit); object-position:var(--gallery-position); height:auto; }
@media(max-width:700px) { .page-gallery > div > button { grid-column:auto / span var(--gallery-mobile-span,12); margin-top:var(--gallery-mobile-space,0px); } }
