@font-face {
  font-family: Newsreader;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/data/fonts/newsreader-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("/data/fonts/source-sans-3-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Noto Sans Bengali";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/data/fonts/noto-sans-bengali.ttf") format("truetype");
}
@font-face {
  font-family: "Noto Emoji";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("/data/fonts/noto-emoji.ttf") format("truetype");
}
.ks-page {
  background: #e9e2d6;
  padding: 24px;
  font:
    14px/1.45 "Source Sans 3",
    "Noto Sans Bengali",
    "Noto Emoji",
    sans-serif;
}
.ks-app {
  max-width: 1180px;
  min-height: calc(100dvh - 48px);
  margin: auto;
  background: var(--paper);
  border-radius: 8px;
  box-shadow: 0 10px 35px #2a261c16;
  display: flex;
  flex-direction: column;
}
.ks-app h1,
.ks-app h2,
.ks-app h3,
.ks-serif,
.ks-product h3,
.ks-trip-panel h2 {
  font-family: Newsreader, "Noto Sans Bengali", "Noto Emoji", Georgia, serif;
  font-weight: 400;
  line-height: 1.16;
}
.ks-app h1 {
  font-size: 28px;
  letter-spacing: -0.02em;
  margin: 0 0 6px;
}
.ks-app h2 {
  font-size: 24px;
  letter-spacing: -0.01em;
}
.ks-app h3 {
  font-size: 18px;
}
.ks-header {
  padding: 12px 24px;
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 64px;
}
.ks-home,
.ks-header-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.ks-home .brand {
  font-family: Newsreader, Georgia, serif;
  font-size: 30px;
  letter-spacing: -1px;
}
.ks-home .ks-link {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.ks-header-actions {
  justify-content: flex-end;
  font-size: 12px;
  flex-wrap: wrap;
  gap: 8px 12px;
}
@media (min-width: 1001px) {
  .ks-header-actions {
    flex-wrap: nowrap;
  }
  .ks-header-actions .ks-link {
    white-space: nowrap;
  }
}
#ks-stages {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
}
.ks-stage {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 999px;
  padding: 7px 12px;
  min-height: 44px;
  background: none;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
}
.ks-stage-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  background: var(--line);
  color: var(--muted);
}
.ks-stage[data-done="true"] {
  color: var(--ink);
}
.ks-stage[data-done="true"] .ks-stage-dot {
  background: var(--ink);
  color: var(--white);
}
.ks-stage[aria-current="step"] {
  background: var(--ink);
  color: var(--white);
  font-weight: 600;
}
.ks-stage[aria-current="step"] .ks-stage-dot {
  background: var(--white);
  color: var(--ink);
}
.ks-stage:disabled {
  cursor: default;
  opacity: 0.6;
}
#stage-heading:focus {
  outline: none;
}
.ks-save-state {
  white-space: nowrap;
}
.ks-header-actions .ks-save-draft {
  min-height: 36px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
.ks-toast {
  position: fixed;
  left: 50%;
  bottom: 84px;
  transform: translateX(-50%);
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: calc(100vw - 32px);
  padding: 12px 18px;
  border-radius: 8px;
  background: var(--ink);
  color: var(--white);
  font-size: 14px;
  box-shadow: 0 8px 24px #00000033;
  animation: ks-toast-in var(--motion-medium) ease-out;
}
.ks-toast-action {
  border: 0;
  background: none;
  padding: 0;
  color: #f3c9b8;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  min-height: 24px;
}
@keyframes ks-toast-in {
  from {
    transform: translate(-50%, 12px);
    opacity: 0;
  }
  to {
    transform: translate(-50%, 0);
    opacity: 1;
  }
}
.ks-link {
  border: 0;
  background: none;
  padding: 6px 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--accent);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.ks-link:hover {
  text-decoration: underline;
}
.ks-link:disabled {
  cursor: not-allowed;
}
.ks-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 10px 16px;
  min-height: 44px;
  border: 1px solid #b9ad9d;
  border-radius: 5px;
  background: var(--white);
  color: var(--ink);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.3;
}
.ks-button:hover {
  background: #fff;
}
.ks-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  font-weight: 600;
  padding: 12px 22px;
}
.ks-primary:hover {
  background: #8f3f28;
}
.ks-dark {
  background: var(--ink);
  color: var(--white);
  border-color: var(--ink);
}
.ks-dark:hover {
  background: #25332a;
}
.ks-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
/* A disabled primary keeps a readable label: it explains why it is disabled. */
.ks-primary:disabled {
  opacity: 1;
  background: #d9b8ab;
  border-color: #d9b8ab;
  color: #5a2e1f;
}
#ks-main {
  flex: 1;
  padding: 24px;
  min-width: 0;
  outline: none;
}
.ks-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.ks-heading p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}
.ks-inline-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.ks-library-links {
  margin-bottom: 20px;
}
.ks-shop-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 38px;
  padding: 18px 18px 18px 36px;
  margin: 24px 0 16px;
  border-block: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}
.ks-shop-steps li::marker {
  color: var(--accent);
  font-weight: 700;
}
.ks-shop-intro {
  max-width: 65ch;
  color: var(--muted);
  line-height: 1.6;
}
.ks-shop .ks-heading p:last-child {
  max-width: 52ch;
  font-size: 15px;
}
.ks-shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 16px;
  margin: 28px 0;
}
.ks-shop-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
}
.ks-shop-card[data-available="false"] {
  opacity: 0.7;
}
.ks-shop-art {
  width: 100%;
  height: 120px;
  border-radius: 6px;
  background: linear-gradient(160deg, #dfe5db, #c9d2c3);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 14px;
}
.ks-shop-art span {
  width: 52px;
  height: 74px;
  border-radius: 2px;
  background: var(--white);
  box-shadow: 0 2px 6px #0000002e;
}
.ks-shop-card[data-kind="book"]:nth-of-type(2n) .ks-shop-art,
.ks-shop-art-calendar {
  background: linear-gradient(160deg, #e6d3c6, #d2b7a5);
}
.ks-shop-art-calendar span {
  width: 62px;
  height: 88px;
}
.ks-shop-art-cards,
.ks-shop-art-magnets {
  background: linear-gradient(160deg, #ece5da, #e3dbcf);
}
.ks-shop-art-cards span {
  width: 70px;
  height: 48px;
}
.ks-shop-art-magnets span {
  width: 44px;
  height: 44px;
}
.ks-shop-card h2 {
  font-size: 22px;
  margin: 6px 0 0;
}
.ks-shop-card p {
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}
.ks-shop-price {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.ks-shop-price strong {
  font:
    500 18px Newsreader,
    serif;
  color: var(--ink);
}
.ks-shop-price .ks-hint {
  font-size: 12px;
}
.ks-shop-card .ks-button {
  margin-top: 8px;
  text-align: left;
}
.ks-shop-home {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-top: 32px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}
.ks-shop-home h2 {
  font-size: 20px;
  margin: 0;
}
.ks-shop-home p {
  margin: 4px 0 0;
  color: var(--muted);
}
.ks-muted,
.ks-hint {
  color: var(--muted);
}
.ks-hint {
  font-size: 12px;
  line-height: 1.45;
}
.ks-load-failed {
  max-width: 52ch;
  padding: 24px 0;
}
.ks-load-failed h1 {
  color: #8a3d28;
}
.ks-load-failed p {
  color: var(--muted);
  margin: 0 0 16px;
}
.ks-loading {
  padding: 24px;
  color: var(--muted);
}
.ks-empty {
  padding: 32px 0;
  display: grid;
  justify-items: start;
  gap: 12px;
}
.ks-empty p {
  color: var(--muted);
  max-width: 500px;
}
.ks-row {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 8px 12px;
  min-height: 62px;
  border-bottom: 1px solid var(--line);
}
.ks-row[data-selected="true"] {
  background: #fff9;
}
.ks-row[data-disabled="true"] {
  opacity: 0.45;
}
.ks-check {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  align-self: stretch;
  min-height: 44px;
  cursor: pointer;
}
.ks-check input {
  margin: 0;
  width: 20px;
  height: 20px;
  accent-color: var(--ink);
}
.ks-row-thumb {
  width: 52px;
  height: 38px;
  object-fit: cover;
  border-radius: 3px;
  flex: none;
}
.ks-row-copy {
  flex: 1;
  min-width: 0;
}
.ks-row-title {
  font:
    400 15px/1.25 Newsreader,
    "Noto Sans Bengali",
    "Noto Emoji",
    serif;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ks-row-meta {
  font-size: 12px;
  color: var(--muted);
  margin-top: 3px;
}
.ks-warn-text {
  color: #943e26;
}
.ks-badge {
  font-size: 11px;
  color: #943e26;
  background: #fbe9e2;
  border: 1px solid #efc9bc;
  border-radius: 999px;
  padding: 3px 8px;
  white-space: nowrap;
}
.ks-cover-choice {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
  margin-bottom: 18px;
}
.ks-cover-choice img {
  width: 64px;
  height: 44px;
  object-fit: cover;
  border-radius: 3px;
}
.ks-cover-choice .ks-row-copy {
  min-width: 160px;
}
.ks-journal-toggle {
  margin-top: 16px;
}
.ks-journal {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}
.ks-journal-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}
.ks-journal-filters button {
  min-height: 44px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: none;
  font-size: 12px;
}
.ks-journal-filters [aria-pressed="true"] {
  background: var(--ink);
  color: var(--white);
}
.ks-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.ks-field-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
  min-width: 0;
}
.ks-field-heading .ks-link {
  font-size: 12px;
  min-height: 32px;
}
.ks-input {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  background: #fff;
  border: 1px solid #d9cfc1;
  border-radius: 5px;
  padding: 10px 12px;
  font:
    400 15px/1.4 Newsreader,
    "Noto Sans Bengali",
    "Noto Emoji",
    serif;
}
.ks-input[aria-invalid="true"] {
  border-color: #a44d32;
}
textarea.ks-input {
  min-height: 84px;
  resize: vertical;
}
.ks-field-help {
  font-size: 11px;
  color: var(--muted);
}
.ks-invalid .ks-field-help {
  color: #943e26;
}
.ks-personalize {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.ks-item-list {
  display: grid;
  gap: 4px;
  margin-top: 14px;
}
.ks-item {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 6px;
}
.ks-item[data-active="true"] {
  background: #fff;
  box-shadow: inset 3px 0 var(--accent);
}
.ks-item-activate {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  min-height: 54px;
  min-width: 0;
  flex: 1;
  border: 0;
  background: transparent;
  text-align: left;
}
.ks-ordinal {
  width: 18px;
  flex: none;
  font-size: 11px;
  color: var(--accent);
}
.ks-item img {
  width: 40px;
  height: 30px;
  object-fit: cover;
  border-radius: 3px;
}
.ks-item .ks-row-title {
  font-size: 14px;
}
.ks-item .ks-row-meta {
  font-size: 11px;
}
.ks-reorder {
  display: flex;
}
.ks-reorder button {
  min-width: 44px;
  min-height: 44px;
  background: none;
  border: 0;
  color: var(--muted);
}
.ks-editor {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 14px;
  min-width: 0;
}
.ks-editor-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}
.ks-editor-heading h3 {
  overflow-wrap: anywhere;
}
.ks-editor-heading span {
  white-space: nowrap;
  font-size: 12px;
  color: var(--muted);
}
.ks-editor-controls {
  display: grid;
  gap: 12px;
}
.ks-preview-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ks-proof-image {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 8px 24px #281e141c;
}
.ks-preview-square {
  width: min(100%, 240px);
}
.ks-photo-options {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ks-photo-pick {
  width: 64px;
  height: 48px;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 3px;
}
.ks-photo-pick img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.ks-photo-pick[aria-pressed="true"] {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.ks-segment {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  border: 1px solid #d9cfc1;
  border-radius: 5px;
  overflow: hidden;
}
.ks-segment button {
  padding: 7px 12px;
  min-height: 44px;
  border: 0;
  background: #fff;
  font-size: 12px;
}
.ks-segment [aria-pressed="true"] {
  background: var(--ink);
  color: var(--white);
}
.ks-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 44px;
  font-size: 13px;
  cursor: pointer;
}
.ks-toggle input {
  appearance: none;
  width: 34px;
  height: 20px;
  border: 1px solid #9e9588;
  border-radius: 999px;
  background: #b9b1a5;
  position: relative;
  flex: none;
}
.ks-toggle input::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  top: 2px;
  left: 2px;
  transition: transform 150ms ease;
}
.ks-toggle input:checked {
  background: var(--accent);
  border-color: var(--accent);
}
.ks-toggle input:checked::after {
  transform: translateX(14px);
}
.ks-toggle input:disabled {
  opacity: 0.5;
}
.ks-settings {
  margin-top: 14px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 6px;
}
.ks-settings summary {
  min-height: 48px;
  padding: 12px 14px;
  font-size: 13px;
  cursor: pointer;
}
.ks-settings-fields {
  padding: 0 14px 14px;
  display: grid;
  gap: 12px;
}
.ks-footer {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 14px 24px;
  background: var(--paper);
  border-top: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
  margin-top: 0;
}
.ks-footer-copy {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  min-width: 0;
}
.ks-counter {
  display: flex;
  align-items: center;
  gap: 12px;
  font:
    400 15px Newsreader,
    serif;
}
.ks-footer-copy p {
  font-size: 12px;
  color: var(--muted);
}
.ks-footer-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: none;
}
#ks-pips {
  display: inline-flex;
  gap: 3px;
}
#ks-pips span {
  width: 10px;
  height: 16px;
  border: 1px solid #b9ad9d;
  border-radius: 2px;
}
#ks-pips .filled {
  background: var(--ink);
  border-color: var(--ink);
}
.ks-banners:empty {
  display: none;
}
.ks-banners {
  display: grid;
  gap: 8px;
  padding: 16px 24px 0;
}
.ks-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border: 1px solid #efc9bc;
  border-radius: 6px;
  background: #fbe9e2;
  color: #873d27;
  font-size: 13px;
}
.ks-banner p {
  flex: 1;
  min-width: min(100%, 200px);
}
.ks-banner .ks-link {
  font-size: 12px;
}
.ks-success {
  background: #eef3ea;
  border-color: #cfdcc6;
  color: #3b5a2f;
}
.ks-review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
  gap: 18px;
}
.ks-review-grid[data-view="pages"] {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}
.ks-review-grid[data-product="book"][data-view="pages"] {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
.ks-review-grid[data-product="squares"][data-view="items"] {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.ks-review-item {
  min-width: 0;
  margin: 0;
}
.ks-review-open {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}
.ks-review-open:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}
/* Review your book */
.ks-review-book .ks-stage-sub {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 14px;
}
.ks-page-gate {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin: 20px 0 16px;
  padding: 16px 18px;
  border-radius: 10px;
  border: 1px solid;
}
.ks-page-gate-short {
  background: #f7e4dd;
  border-color: #ead2c8;
}
.ks-page-gate-copy {
  flex: 1 1 260px;
}
.ks-page-gate-copy p {
  margin: 0;
}
.ks-page-gate-title {
  font:
    400 19px/1.25 Newsreader,
    serif;
  color: #8a3d28;
}
.ks-page-gate-short .ks-hint {
  margin-top: 2px;
}
.ks-page-gate-ready {
  background: #e9eee6;
  border-color: #d3dccf;
  color: #3f5a3a;
  padding: 12px 18px;
  font-size: 14px;
}
.ks-page-gate-ready .ks-link {
  min-height: 24px;
  padding: 0;
}
.ks-review-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--muted);
}
.ks-review-details {
  min-height: 24px;
  padding: 0;
  font-size: 13px;
  color: var(--muted);
  text-decoration: underline;
}
.ks-review-details-text {
  margin: -6px 0 14px;
  font-size: 13px;
}
.ks-review-pages {
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 16px 12px;
}
.ks-review-pages .ks-proof-image {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 2px 8px #3c28200f;
  background: #fff;
  transition: border-color var(--motion-fast);
}
.ks-review-pages .ks-review-open:hover .ks-proof-image,
.ks-review-pages .ks-review-open:hover .ks-review-blank-group {
  border-color: var(--accent);
}
.ks-review-blank-group {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 148 / 210;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  box-shadow: 0 2px 8px #3c28200f;
}
.ks-review-pages .ks-review-caption {
  margin-top: 6px;
  font-size: 11px;
}
.ks-review-pages .ks-review-caption .ks-link {
  min-height: 20px;
  padding: 0;
  font-size: 11px;
}
/* Shared page inspector */
.ks-modal.ks-book-inspector {
  width: min(900px, calc(100vw - 32px));
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ks-book-inspector .ks-modal-body {
  gap: 0;
  height: 100%;
  min-height: 0;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}
.ks-book-inspector h2 {
  margin: 14px 24px 0;
  font-size: 20px;
}
.ks-book-inspector-tools {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 24px 12px;
  border-bottom: 1px solid var(--line);
}
.ks-book-inspector-tools .ks-button {
  min-height: 36px;
  padding: 6px 12px;
}
.ks-book-inspector-label {
  min-width: 130px;
  text-align: center;
  font-size: 13px;
  color: var(--muted);
}
.ks-book-inspector-tools select {
  flex: 1;
  min-width: 100px;
  width: 100px;
}
.ks-book-inspector-close {
  margin-left: auto;
  width: 44px;
  border: 0;
  background: none;
  font-size: 22px;
  color: var(--muted);
}
.ks-book-inspector-page {
  height: min(60dvh, 680px);
  min-height: 180px;
  overflow: auto;
  background: #ece5da;
  padding: 24px;
}
.ks-book-inspector-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 24px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.ks-book-inspector-footer .ks-hint {
  margin: 0;
}
.ks-book-inspector-footer .ks-link {
  min-height: 24px;
  padding: 0;
}
.ks-book-inspector-page img {
  display: block;
  width: auto;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  margin: auto;
}
.ks-book-inspector-page.is-zoomed img {
  width: 200%;
  max-width: none;
  height: auto;
}
.ks-book-delivery-alternatives .ks-output-grid,
.ks-book-order-format .ks-book-format {
  margin: 16px;
}
.ks-book-proof-navigation {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
}
.ks-book-proof-navigation > select {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
}
.ks-review-item[data-issue="true"] .ks-proof-image {
  outline: 2px solid #ce9077;
}
.ks-review-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
}
.ks-review-caption span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ks-review-caption .ks-link {
  white-space: nowrap;
  font-size: 12px;
}
.ks-progress {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 0;
  font-size: 13px;
  color: var(--muted);
}
.ks-progress progress {
  width: 100%;
  height: 8px;
  accent-color: var(--accent);
}
.ks-progress span {
  flex: none;
}
.ks-output-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0;
}
.ks-output {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 8px;
  min-height: 136px;
  padding: 16px;
  text-align: left;
  border: 2px solid var(--line);
  border-radius: 6px;
  background: #fff;
}
.ks-output[aria-pressed="true"] {
  border-color: var(--accent);
}
.ks-output strong {
  font:
    400 18px Newsreader,
    serif;
}
.ks-output span {
  font-size: 12px;
  color: var(--muted);
}
.ks-output b {
  font-size: 13px;
  margin-top: auto;
}
.ks-output-coming-soon {
  background: var(--paper);
}
.ks-output-coming-soon b,
.ks-coming-soon-badge {
  display: inline-block;
  width: fit-content;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-size: 12px;
  font-weight: 600;
}
.ks-print-coming-soon {
  max-width: 720px;
  margin: 24px auto;
  padding: 28px;
  gap: 16px;
  text-align: center;
  justify-items: center;
}
.ks-print-coming-soon h2 {
  font-size: 28px;
}
.ks-print-coming-soon p {
  max-width: 560px;
  margin: 0;
}
.ks-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  font-size: 13px;
}
.ks-book-format {
  margin-bottom: 16px;
}
.ks-book-format p {
  margin: 0;
}
/* Format chip: format · page status · Change · Print details, on one line. */
.ks-format-chip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 24px;
  padding: 14px 18px;
  font-size: 14px;
}
.ks-format-name {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ks-format-glyph {
  width: 14px;
  height: 18px;
  border-radius: 2px;
  background: var(--ink);
  display: inline-block;
}
.ks-format-chip .ks-link {
  min-height: 24px;
  padding: 0;
}
.ks-format-chip .ks-book-page-count {
  color: var(--muted);
}
.ks-format-chip .ks-book-page-count.ks-warn-text {
  color: #8a3d28;
}
.ks-format-actions {
  gap: 10px 16px;
}
.ks-book-page-progress {
  width: min(100%, 160px);
  height: 6px;
  accent-color: var(--accent);
}
.ks-format-details {
  flex-basis: 100%;
  order: 10;
}
.ks-format-chip:has(.ks-format-details) {
  padding-bottom: 12px;
}
.ks-format-details summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  list-style: none;
  margin-left: auto;
  width: max-content;
}
.ks-format-details summary::-webkit-details-marker {
  display: none;
}
.ks-format-details[open] summary {
  margin-bottom: 8px;
}
.ks-format-details p {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}
.ks-format-details:not([open]) {
  margin-left: auto;
  flex-basis: auto;
}

/* Choose photos */
.ks-choose .ks-heading {
  align-items: flex-end;
}
.ks-section-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 22px 0 10px;
}
.ks-section-heading h2 {
  font-size: 20px;
  margin: 0;
}
.ks-chapter-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
  gap: 10px;
}
.ks-chapter-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  min-width: 0;
}
.ks-chapter-card[data-new="true"] {
  border-color: #9aa892;
}
.ks-chapter-card-thumb {
  width: 46px;
  height: 46px;
  border-radius: 5px;
  object-fit: cover;
  background: var(--line);
  flex: none;
}
.ks-chapter-card .ks-row-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}
.ks-chapter-card .ks-row-meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ks-new-badge {
  background: #dfe5db;
  color: #3f5a3a;
  font:
    600 10px "Source Sans 3",
    sans-serif;
  letter-spacing: 0.6px;
  padding: 2px 6px;
  border-radius: 3px;
  flex: none;
}
.ks-chapter-remove {
  width: 44px;
  height: 44px;
  margin: -8px -12px -8px 0;
  border: 0;
  background: none;
  color: var(--muted);
  font-size: 18px;
  cursor: pointer;
  flex: none;
}
.ks-chapter-remove:hover {
  color: var(--accent);
}
.ks-choose-empty {
  border: 1px dashed #cfc6b8;
  border-radius: 10px;
  padding: 26px;
  text-align: center;
  color: var(--muted);
}
.ks-journal-tools {
  gap: 8px 14px;
}
.ks-journal-search {
  margin: 0;
}
.ks-journal-search .ks-field-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.ks-journal-search .ks-input {
  width: 220px;
  max-width: 100%;
  padding: 8px 10px;
}
.ks-journal-search .ks-field-help {
  display: none;
}
.ks-journal-rows {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  overflow: hidden;
}
.ks-journal-row {
  border-radius: 0;
  border-bottom: 1px solid #eee7dc;
  background: transparent;
  padding: 10px 16px;
}
.ks-journal-row:last-child {
  border-bottom: 0;
}
.ks-journal-row .ks-row-thumb {
  width: 40px;
  height: 32px;
}
.ks-row-thumb-empty {
  background: var(--line);
  border-radius: 4px;
  display: inline-block;
}
.ks-journal-pick {
  white-space: nowrap;
  flex: none;
}
.ks-journal-empty {
  padding: 22px;
  text-align: center;
}

/* Photo library */
.ks-modal.ks-book-library {
  height: min(900px, calc(100dvh - 32px));
  overflow: hidden;
}
.ks-book-library .ks-modal-body {
  height: 100%;
  min-height: 0;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
}
.ks-book-library-search {
  position: relative;
}
.ks-book-library-search .ks-field {
  margin: 0;
}
.ks-book-library-search .ks-field-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.ks-book-library-search .ks-field-help {
  display: none;
}
.ks-book-library-search .ks-input {
  padding-right: 40px;
}
.ks-book-library-search .ks-input::-webkit-search-cancel-button,
.ks-journal-search .ks-input::-webkit-search-cancel-button {
  appearance: none;
}
.ks-book-library-clear {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border: 0;
  background: none;
  color: var(--muted);
  font-size: 18px;
  cursor: pointer;
}
.ks-book-library-results {
  overflow: auto;
  min-height: 0;
}
.ks-book-library-trip h3 {
  font-size: 19px;
  margin: 8px 0 4px;
}
.ks-book-library-memory {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  margin: 10px 0;
  min-width: 0;
  background: var(--white);
}
.ks-book-library-memory legend {
  font-weight: 600;
  padding: 0 4px;
}
.ks-book-library-memory-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px 12px;
  margin: 0 0 10px;
}
.ks-book-library-memory-head .ks-link {
  min-height: 24px;
  padding: 0;
  font-size: 12px;
}
.ks-book-library-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 10px;
}
.ks-book-library-photo {
  position: relative;
  aspect-ratio: 1;
  border: 2px solid transparent;
  border-radius: 6px;
  background: var(--line);
  overflow: hidden;
}
.ks-book-library-photo[data-selected="true"] {
  border-color: var(--accent);
}
.ks-book-library-photo[data-locked="true"] {
  opacity: 0.75;
}
.ks-book-library-photo:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.ks-book-library-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ks-book-library-tick {
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 6px;
  cursor: pointer;
}
.ks-book-library-tick input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #3a3e39;
  background: #fff;
  cursor: pointer;
}
.ks-book-library-enlarge {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 44px;
  height: 44px;
  border: 0;
  background: none;
  cursor: pointer;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 4px;
  color: var(--ink);
}
.ks-book-library-enlarge::before {
  content: "⤢";
  width: 28px;
  height: 28px;
  border-radius: 5px;
  background: #ffffffe6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}
.ks-book-library-enlarge {
  font-size: 0;
}
.ks-book-library-number {
  position: absolute;
  left: 6px;
  bottom: 6px;
  font-size: 10px;
  color: #fff;
  text-shadow: 0 1px 2px #0009;
}
.ks-book-library-lock {
  position: absolute;
  top: 6px;
  right: 6px;
  font:
    600 9px "Source Sans 3",
    sans-serif;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 2px 5px;
  border-radius: 3px;
  background: #3a3e39;
  color: #fff;
}
.ks-book-library-loading,
.ks-book-library-failed {
  padding: 12px 0;
}
.ks-book-library-failed h3 {
  color: #8a3d28;
  margin: 0 0 6px;
}
.ks-book-library-skeleton {
  display: flex;
  gap: 8px;
}
.ks-book-library-skeleton span {
  width: 96px;
  height: 96px;
  border-radius: 6px;
  background: var(--line);
  animation: ks-shimmer 1.4s ease-in-out infinite;
}
.ks-book-library-skeleton span:nth-child(2) {
  animation-delay: 0.2s;
}
.ks-book-library-skeleton span:nth-child(3) {
  animation-delay: 0.4s;
}
@keyframes ks-shimmer {
  0%,
  100% {
    opacity: 0.55;
  }
  50% {
    opacity: 1;
  }
}
.ks-book-library-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  background: var(--paper);
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.ks-book-library-footer p {
  margin: 0;
}
.ks-book-library-footer p[role="status"] {
  font-weight: 600;
  color: var(--ink);
}
.ks-book-library-footer .ks-toggle {
  margin: 0;
}
.ks-book-library-footer .ks-button:not(.ks-primary) {
  margin-left: auto;
}
.ks-book-library-footer [role="alert"] {
  flex-basis: 100%;
}
.ks-book-library-footer [role="alert"]:empty {
  display: none;
}
.ks-book-library .ks-modal-body > p {
  margin: 0;
}
/* Larger preview over the library */
.ks-modal.ks-photo-preview {
  width: min(640px, calc(100vw - 32px));
}
.ks-photo-preview .ks-modal-body {
  position: relative;
}
.ks-photo-preview-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 44px;
  height: 44px;
  border: 0;
  background: none;
  font-size: 22px;
  color: var(--muted);
  cursor: pointer;
}
.ks-photo-preview-stage {
  height: min(52vh, 420px);
  border-radius: 8px;
  background: var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.ks-photo-preview-stage img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.ks-photo-preview-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.ks-order-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.ks-order-products {
  display: grid;
  gap: 12px;
  align-content: start;
}
.ks-order-product {
  display: grid;
  gap: 6px;
  text-align: left;
  border: 2px solid var(--line);
  padding: 12px 14px;
  border-radius: 6px;
  background: #fff;
  min-height: 82px;
}
.ks-order-product[aria-pressed="true"] {
  border-color: var(--accent);
}
.ks-order-product span {
  font-size: 12px;
  color: var(--muted);
}
.ks-price-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.ks-price-total {
  border-top: 1px solid var(--line);
  padding-top: 12px;
  font-size: 15px;
  font-weight: 600;
}
.ks-gift-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
}
.ks-gift-fields .ks-field:last-child {
  grid-column: 1/-1;
}
.ks-modal {
  width: min(900px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: 22px;
  border: 0;
  border-radius: 12px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 20px 50px #281e1459;
  font:
    14px/1.45 "Source Sans 3",
    "Noto Sans Bengali",
    "Noto Emoji",
    sans-serif;
}
.ks-modal::backdrop {
  background: #2a262273;
}
.ks-modal h2 {
  font:
    400 26px/1.15 Newsreader,
    serif;
}
.ks-modal h3 {
  font:
    400 20px/1.15 Newsreader,
    serif;
}
.ks-modal-body {
  display: grid;
  gap: 14px;
}
.ks-modal-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
}
.ks-modal-small {
  max-width: 520px;
}
.ks-plus-sheet {
  margin-bottom: 16px;
}
.ks-ai-source {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.ks-intro-sources {
  display: grid;
  gap: 12px;
}
.ks-benefits {
  display: grid;
  gap: 10px;
  padding-left: 18px;
  margin: 0;
  font-size: 13px;
}
/* Crop for this page: bounded stage, essentials visible, fixed footer. */
.ks-modal.ks-crop-dialog {
  width: min(880px, calc(100vw - 32px));
  max-height: calc(100dvh - 40px);
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.ks-crop-dialog .ks-modal-body {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 0;
  height: 100%;
  min-height: 0;
}
.ks-crop-dialog h2 {
  margin: 18px 24px 0;
}
.ks-crop-slot {
  display: block;
  margin: 2px 24px 0;
  font-size: 12px;
}
.ks-crop-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding: 16px 24px;
  overflow: auto;
  min-height: 0;
}
.ks-crop-left {
  flex: 1 1 260px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.ks-crop-right {
  flex: 1 1 240px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.ks-crop-stage {
  position: relative;
  height: min(52vh, 420px);
  max-width: 100%;
  aspect-ratio: 4 / 3;
  touch-action: none;
  user-select: none;
  cursor: grab;
  border-radius: 4px;
  background: var(--ink);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ks-crop-preview {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  border-radius: 4px;
  background: var(--ink);
}
.ks-crop-stage:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.ks-crop-stage.is-dragging {
  cursor: grabbing;
}
.ks-crop-ppi {
  margin: 0;
  text-align: center;
  font-size: 12px;
}
.ks-crop-zoom {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 8px;
}
.ks-crop-zoom button {
  padding: 0;
  min-height: 34px;
  min-width: 34px;
  font-size: 18px;
}
.ks-crop-zoom-row label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.ks-crop-auto h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  font-family: "Source Sans 3", sans-serif;
}
.ks-crop-auto-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ks-crop-auto-pick {
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 2px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 500;
}
.ks-crop-auto-pick small {
  font-size: 11px;
  font-weight: 400;
  color: var(--muted);
}
.ks-crop-auto-pick[aria-pressed="true"] {
  background: #eee7dc;
  border-color: var(--accent);
}
.ks-crop-auto .ks-hint {
  margin: 8px 0 0;
  font-size: 12px;
}
.ks-crop-details {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.ks-crop-details summary {
  cursor: pointer;
  color: var(--accent);
  font-size: 13px;
  font-weight: 600;
  min-height: 32px;
  display: flex;
  align-items: center;
}
.ks-crop-details-body {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}
.ks-crop-right > .ks-hint {
  font-size: 12px;
  margin: 0;
}
.ks-crop-actions {
  margin: 0;
  padding: 14px 24px;
  border-top: 1px solid var(--line);
  background: var(--paper);
  flex-wrap: wrap;
  gap: 10px;
}
.ks-crop-actions-spacer {
  flex: 1;
}
.ks-range {
  display: grid;
  gap: 5px;
}
.ks-range label {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  font-size: 12px;
  color: var(--muted);
}
.ks-range output {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.ks-range input {
  width: 100%;
  min-height: 32px;
  accent-color: var(--accent);
}
.ks-presets {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ks-presets button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 12px;
  background: #fff;
  font-size: 12px;
}
.ks-position button {
  min-width: 44px;
}
.ks-trip-panel {
  grid-column: 1/-1;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  margin-top: 20px;
  font-family: "Source Sans 3", sans-serif;
}
#trip-keepsakes-panel {
  grid-column: 1 / -1;
  min-width: 0;
}
.ks-mini-frame {
  border: 7px solid #615041;
  padding: 6px;
  background: #fff;
}
.ks-trip-panel h2 {
  font-size: 28px;
  margin: 6px 0 8px;
}
.ks-trip-panel > p {
  color: var(--muted);
  font-size: 13px;
}
.ks-products,
.ks-library-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
  margin-top: 20px;
}
.ks-product,
.ks-library-card,
.ks-saved-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  text-decoration: none;
}
.ks-product:hover {
  border-color: var(--accent);
}
.ks-product h3 {
  font-size: 18px;
}
.ks-product p,
.ks-library-card p {
  font-size: 12px;
  color: var(--muted);
}
.ks-product-preview {
  height: 138px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #faf7f0;
  padding: 12px;
}
.ks-product-preview img {
  max-width: 100%;
  max-height: 100%;
  height: 100%;
  object-fit: contain;
  box-shadow: 0 4px 12px #281e1426;
}
.ks-product {
  background: #faf7f0;
}
.ks-mini-cards {
  position: relative;
}
.ks-mini-cards img:first-child {
  transform: translate(-18px, -3px) rotate(-5deg);
}
.ks-mini-cards img:last-child {
  position: absolute;
  height: 76%;
  transform: translate(25px, 9px) rotate(4deg);
}
.ks-mini-squares {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 5px;
  padding: 8px 18px;
}
.ks-mini-squares img {
  width: 100%;
  height: 100%;
}
.ks-product-prices {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: auto;
  font-size: 11px;
}
.ks-product-prices span:last-child {
  color: var(--accent);
}
.ks-trip-library {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.ks-library-grid {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}
.ks-library-card h2 {
  font-size: 22px;
  overflow-wrap: anywhere;
}
.ks-saved-cover {
  width: 100%;
  height: 160px;
  object-fit: cover;
  border-radius: 4px;
}
.ks-saved-card h2 {
  font-size: 22px;
  overflow-wrap: anywhere;
}
.ks-saved-card .ks-inline-actions {
  margin-top: auto;
}
.ks-library-card .ks-inline-actions {
  margin-top: auto;
}
.ks-year-note {
  border: 1px dashed #b9ad9d;
  border-radius: 6px;
  padding: 24px;
  color: var(--muted);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}
.ks-year-note p {
  font-size: 13px;
}
/* Make it yours */
.ks-make .ks-stage-sub {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 14px;
}
.ks-make-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
  margin-top: 20px;
}
.ks-make-rail {
  flex: 1 1 220px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ks-rail-cover {
  display: flex;
  gap: 12px;
  align-items: center;
  text-align: left;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 8px;
  background: var(--white);
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.ks-rail-cover[aria-current="true"] {
  border-color: var(--accent);
}
.ks-rail-cover:not([aria-current="true"]) .ks-warn-text + * {
  border-color: #d9b8ab;
}
.ks-rail-cover-thumb {
  width: 34px;
  height: 44px;
  border-radius: 3px;
  object-fit: cover;
  background: #f1ece3;
  border: 1px solid var(--line);
  flex: none;
}
.ks-rail-eyebrow {
  margin: 8px 0 0 4px;
  color: var(--muted);
  letter-spacing: 1.5px;
  font-size: 11px;
  font-weight: 600;
}
.ks-rail-chapters {
  margin-top: 0;
  gap: 6px;
}
.ks-rail-chapters .ks-item {
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 8px;
  background: var(--white);
}
.ks-rail-chapters .ks-item[data-active="true"] {
  border-color: var(--accent);
  box-shadow: none;
}
.ks-rail-chapters .ks-item .ks-reorder {
  flex-direction: column;
  flex: none;
  padding-right: 4px;
}
.ks-rail-chapters .ks-item .ks-reorder button {
  min-width: 28px;
  min-height: 22px;
  padding: 0;
  font-size: 11px;
  line-height: 1;
}
.ks-rail-chapters .ks-item-activate {
  padding: 8px 8px 8px 12px;
  min-height: 52px;
}
.ks-rail-chapters .ks-row-copy {
  min-width: 0;
}
.ks-rail-chapters .ks-row-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ks-rail-chapters.ks-item-list {
  overflow-x: hidden;
}
.ks-rail-thumb-empty {
  width: 40px;
  height: 30px;
  border-radius: 3px;
  background: var(--line);
  flex: none;
  display: inline-block;
}
.ks-make-editor {
  flex: 3 1 480px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
  min-width: 0;
}
.ks-make-preview {
  flex: 1 1 260px;
  position: sticky;
  top: 16px;
  min-width: 0;
}
.ks-make-preview-label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 8px;
}
.ks-make-page .ks-proof-image {
  width: 100%;
  border: 1px solid var(--line);
  box-shadow: 0 8px 24px #3c28200f;
  background: #fff;
}
.ks-make-page-nav {
  justify-content: space-between;
  margin-top: 6px;
}
.ks-make-preview > .ks-hint {
  margin: 8px 0 0;
  font-size: 12px;
}
.ks-make-preview [role="status"][hidden] {
  display: none;
}
.ks-make-controls {
  flex: 1.4 1 300px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-width: 0;
}
.ks-make-controls .ks-field {
  margin: 0;
}
.ks-make-controls .ks-field-heading label {
  font-size: 13px;
  font-weight: 600;
}
.ks-serif-input {
  font-family: Newsreader, Georgia, serif;
  font-size: 16px;
}
.ks-cover-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.ks-cover-option {
  width: 64px;
  height: 80px;
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 5px;
  background: #fff;
  overflow: hidden;
  cursor: pointer;
  font-size: 11px;
  color: var(--muted);
}
.ks-cover-option[aria-pressed="true"] {
  border-color: var(--accent);
}
.ks-cover-option-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ks-cover-photos .ks-hint {
  margin: 8px 0 0;
  font-size: 12px;
}
.ks-make-more {
  margin-top: 0;
}
.ks-make-words {
  display: grid;
  gap: 8px;
}
.ks-make-words .ks-toggle span {
  font-size: 13px;
  font-weight: 600;
}
.ks-make-words .ks-inline-actions .ks-toggle {
  min-height: 32px;
}
.ks-make-words .ks-inline-actions .ks-toggle span {
  font-weight: 400;
}

/* Delivery & order for printed books */
.ks-order-book {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
  margin-top: 20px;
}
.ks-proof-column {
  flex: 1.6 1 320px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.ks-proof-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px;
}
.ks-proof-head h2 {
  font-size: 20px;
  margin: 0;
}
.ks-proof-version {
  font-size: 12px;
}
.ks-proof-well {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 320px;
  padding: 20px;
  border-radius: 10px;
  background: #ece5da;
  text-align: center;
}
.ks-proof-placeholder {
  width: min(240px, 70%);
  aspect-ratio: 148 / 210;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border: 1px dashed #cfc6b8;
  background: #fff;
  color: var(--muted);
  font-size: 13px;
}
.ks-proof-shimmer {
  border: 0;
  animation: ks-shimmer 1.4s ease-in-out infinite;
}
.ks-proof-well .ks-hint {
  margin: 0;
  max-width: 40ch;
  font-size: 12px;
}
.ks-proof-problem {
  margin: 0;
  color: #8a3d28;
  font-size: 18px;
}
.ks-proof-page {
  width: min(260px, 75%);
  padding: 0;
  border: 0;
  background: #fff;
  box-shadow: 0 8px 24px #3c28201f;
  cursor: zoom-in;
}
.ks-proof-page:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}
.ks-proof-page .ks-physical-proof-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  margin: 0;
  border: 0;
  box-shadow: none;
}
.ks-proof-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}
.ks-proof-nav .ks-button {
  min-height: 36px;
  padding: 6px 12px;
}
.ks-proof-nav select {
  max-width: 260px;
  min-width: 0;
  flex: 1 1 140px;
}
.ks-proof-nav-label {
  flex-basis: 100%;
  font-size: 12px;
  color: var(--muted);
  margin: 0;
}
.ks-proof-notes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
}
.ks-proof-notes p {
  margin: 0;
}
.ks-proof-notes .ks-link {
  min-height: 24px;
  padding: 0;
  text-decoration: underline;
}
.ks-proof-notes > .ks-link {
  align-self: flex-start;
  text-decoration: none;
}
.ks-proof-approval {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  cursor: pointer;
}
.ks-proof-approval input {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  flex: none;
  accent-color: #3a3e39;
}
.ks-order-card {
  flex: 1 1 280px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  min-width: 0;
}
.ks-order-card h2 {
  font-size: 22px;
  margin: 0;
}
.ks-order-format {
  font-size: 14px;
}
.ks-order-pages {
  margin: -12px 0 0;
  font-size: 13px;
}
.ks-order-quantity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}
.ks-stepper {
  display: inline-flex;
  border: 1px solid #cfc6b8;
  border-radius: 6px;
  overflow: hidden;
}
.ks-stepper .ks-button {
  width: 44px;
  min-height: 34px;
  padding: 0;
  border: 0;
  border-radius: 0;
}
.ks-stepper strong {
  width: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid #cfc6b8;
  border-right: 1px solid #cfc6b8;
}
.ks-order-country {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 14px;
}
.ks-order-country .ks-hint {
  margin: 0;
  font-size: 12px;
}
.ks-order-card .ks-toggle {
  min-height: 32px;
}
.ks-order-card .ks-field {
  margin: 0;
}
.ks-price-rows {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 12px;
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 14px;
}
.ks-price-rows dd {
  margin: 0;
  text-align: right;
}
.ks-price-rows dt.ks-price-total,
.ks-price-rows dd.ks-price-total {
  font-weight: 600;
  border-top: 1px solid var(--line);
  padding-top: 8px;
  margin-top: 4px;
}
.ks-price-note {
  margin: -6px 0 0;
  font-size: 12px;
}
.ks-order-notice:empty {
  display: none;
}
.ks-order-action {
  width: 100%;
}
.ks-order-card .ks-hint {
  margin: 0;
}

@media (max-width: 1320px) {
  .ks-header {
    gap: 12px;
  }
  .ks-stage {
    padding: 7px 10px;
    font-size: 12px;
    gap: 6px;
  }
  .ks-home .ks-link {
    max-width: 150px;
  }
}
@media (max-width: 1000px) {
  .ks-header {
    grid-template-columns: 1fr auto;
  }
  .ks-header nav {
    grid-column: 1/-1;
    grid-row: 2;
    justify-content: center;
  }
  .ks-output-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
  .ks-footer-copy {
    display: grid;
    gap: 6px;
  }
}
@media (max-width: 639px) {
  .ks-page {
    padding: 0;
  }
  .ks-app {
    min-height: 100dvh;
    border-radius: 0;
    box-shadow: none;
  }
  .ks-header {
    padding: 10px 16px;
    gap: 4px 10px;
  }
  .ks-home {
    gap: 10px;
  }
  .ks-home .ks-link {
    font-size: 12px;
  }
  .ks-header-actions {
    max-width: none;
    grid-row: 2;
    grid-column: 1 / -1;
    justify-content: space-between;
    gap: 8px;
  }
  .ks-header-actions > .ks-hint {
    order: 3;
    flex-basis: 100%;
    text-align: right;
    font-size: 11px;
  }
  .ks-header nav {
    grid-row: 3;
  }
  .ks-home {
    grid-column: 1 / -1;
  }
  .ks-header-actions .ks-link {
    font-size: 12px;
  }
  #journal-order-keepsake {
    grid-column: 1 / -1;
    min-height: 44px;
  }
  .ks-shop-steps {
    flex-direction: column;
    gap: 10px;
  }
  .ks-stage {
    padding: 8px 9px;
  }
  #ks-main {
    padding: 20px 16px;
  }
  .ks-banners {
    padding: 12px 16px 0;
  }
  .ks-personalize,
  .ks-order-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .ks-crop-stage {
    height: min(42vh, 360px);
  }
  .ks-editor,
  .ks-make-preview {
    position: static;
  }
  .ks-make-rail {
    max-width: none;
  }
  .ks-item-list {
    max-height: 250px;
    overflow: auto;
  }
  .ks-row {
    gap: 8px;
    padding: 8px 4px;
  }
  .ks-row-meta {
    font-size: 11px;
  }
  .ks-row .ks-badge {
    max-width: 66px;
    white-space: normal;
    text-align: center;
  }
  .ks-row-thumb {
    width: 44px;
    height: 36px;
  }
  .ks-footer {
    position: sticky;
    border-radius: 0;
    padding: 12px 16px max(12px, env(safe-area-inset-bottom));
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  .ks-footer-copy {
    display: flex;
    gap: 4px 12px;
  }
  .ks-footer-actions {
    display: flex;
  }
  .ks-footer-actions .ks-primary {
    flex: 1;
  }
  .ks-counter {
    font-size: 14px;
    gap: 8px;
  }
  #ks-pips span {
    width: 8px;
    height: 12px;
  }
  #ks-pips {
    gap: 2px;
  }
  .ks-footer-copy p {
    font-size: 11px;
  }
  .ks-modal {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    padding: 20px 16px;
    border-radius: 12px 12px 0 0;
    margin-bottom: 0;
  }
  .ks-crop-preview {
    max-height: 42dvh;
    object-fit: contain;
  }
  .ks-crop-right {
    min-height: 390px;
  }
  .ks-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
  .ks-review-grid[data-product="squares"][data-view="items"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .ks-review-grid[data-view="pages"],
  .ks-review-grid[data-product="book"][data-view="pages"] {
    grid-template-columns: 1fr;
  }
  .ks-progress {
    flex-wrap: wrap;
  }
  .ks-progress progress {
    flex: 1;
    min-width: 120px;
  }
  .ks-trip-panel {
    padding-top: 20px;
  }
  .ks-products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .ks-product {
    padding: 10px;
  }
  .ks-product-preview {
    height: 110px;
    padding: 8px;
  }
  .ks-product h3 {
    font-size: 17px;
  }
  .ks-product-prices {
    font-size: 10px;
  }
  .ks-output-grid {
    grid-template-columns: 1fr;
  }
  .ks-output {
    min-height: 112px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ks-app *,
  .ks-modal * {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}
/* Physical product proof and destination-bound quote. */
.ks-order-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
  gap: 40px;
  margin-top: 32px;
}
.ks-order-products {
  display: grid;
  gap: 10px;
}
.ks-order-product {
  display: flex;
  justify-content: space-between;
  text-align: left;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  padding: 18px;
  min-height: 70px;
  color: var(--ink);
}
.ks-order-product[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--accent);
}
.ks-order-summary {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--white);
  align-self: start;
  display: grid;
  gap: 16px;
}
.ks-order-summary h2,
.ks-order-summary p {
  margin: 0;
}
.ks-order-settings {
  display: grid;
  gap: 14px;
}
.ks-order-summary > .ks-primary {
  width: 100%;
}
.ks-order-proof {
  margin-top: 28px;
  display: grid;
  gap: 16px;
}
.ks-physical-proof-image {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 560px;
  object-fit: contain;
  background: white;
  box-shadow: 0 10px 28px #293a2a22;
  margin: 0 auto;
}
.ks-order-proof .ks-toggle {
  line-height: 1.5;
  align-items: flex-start;
}
.ks-frame-proof,
.ks-frame-proof figure {
  display: grid;
  gap: 14px;
  min-width: 0;
  margin: 0;
}
.ks-frame-proof .ks-segment {
  justify-self: start;
  max-width: 100%;
}
.ks-frame-proof .ks-segment button {
  min-height: 44px;
}
.ks-frame-proof .ks-segment button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -4px;
}
.ks-frame-proof-stage {
  display: grid;
  justify-items: center;
  padding: clamp(24px, 5vw, 40px);
  border: 1px solid var(--line);
  border-radius: 12px;
  background: radial-gradient(ellipse at 40% 20%, #f3efe7, #ded6c9);
}
.ks-frame-proof-surround {
  width: min(100%, calc(480px * var(--ks-frame-ratio, 0.75)));
  min-width: 0;
}
.ks-frame-proof .ks-physical-proof-image {
  width: 100%;
  height: auto;
  max-height: none;
  margin: 0;
  box-shadow: none;
}
.ks-frame-proof[data-view="framed"] .ks-frame-proof-surround {
  border: 14px solid;
  border-color: #45433f #191817 #252320 #35332f;
  background: #292723;
  box-shadow:
    2px 3px 0 #171614,
    9px 16px 20px #26201430,
    2px 4px 5px #26201426;
}
.ks-frame-proof[data-view="framed"][data-frame-color="white"]
  .ks-frame-proof-surround {
  border-color: #fffefa #d6d3cd #e3e0d9 #f3f1ec;
  background: #f3f1ec;
  box-shadow:
    2px 3px 0 #c6c2bb,
    9px 16px 20px #26201430,
    2px 4px 5px #26201426;
}
.ks-frame-proof[data-view="artwork"] .ks-frame-proof-stage {
  background: var(--paper);
}
.ks-frame-proof[data-view="artwork"] .ks-physical-proof-image {
  box-shadow: 0 10px 28px #293a2a22;
}
.ks-frame-proof-note {
  margin: 0;
}
.ks-quote-lines {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
}
.ks-quote-lines dd {
  margin: 0;
  font-weight: 600;
  text-align: right;
}
@media (max-width: 760px) {
  /* One-row signed-in header: wordmark + inline badges, then three circles
   * (activity when present, help, account initial). Sign out and the
   * keepsakes link move into the account sheet and the journal's own row. */
  .signed-in .header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: auto;
    min-height: 66px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .signed-in .header-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
  }
  .signed-in .header .brand {
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
  }
  .signed-in .header .brand > svg {
    flex-shrink: 0;
  }
  .signed-in #account-name {
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--accent);
    color: var(--white);
    font-size: 0;
  }
  .signed-in #account-name::before {
    content: attr(data-initial);
    font:
      600 14px/1 "Source Sans 3",
      system-ui,
      sans-serif;
  }
  .signed-in #account-name[data-avatar="true"] {
    background: var(--accent) var(--account-avatar) center / cover no-repeat;
  }
  .signed-in #account-name[data-avatar="true"]::before {
    content: "";
  }
  .signed-in #sign-out,
  .signed-in #header-keepsakes {
    display: none;
  }
  .ks-order-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
  .ks-order-product {
    flex-wrap: wrap;
  }
  .ks-order-summary {
    padding: 18px;
  }
}

@media (max-width: 360px) {
  .signed-in .header .brand {
    font-size: 26px;
    gap: 6px;
  }
}
.ks-book-photos {
  margin: 4px 0;
}
.ks-book-photos h4,
.ks-book-layouts h4,
.ks-cover-photos h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  font-family: "Source Sans 3", sans-serif;
}
.ks-book-photo-bulk {
  gap: 4px 14px;
}
.ks-book-photo-bulk .ks-link {
  min-height: 28px;
  padding: 0;
  font-size: 12px;
}
.ks-book-photo-tray {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}
.ks-book-photo-card {
  width: 104px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ks-book-photo-frame {
  position: relative;
  height: 78px;
  border-radius: 5px;
  border: 2px solid transparent;
  background: #eeeae2;
  overflow: hidden;
  opacity: 0.45;
}
.ks-book-photo-card[data-selected="true"] .ks-book-photo-frame {
  border-color: var(--accent);
  opacity: 1;
}
.ks-book-photo-edit {
  display: block;
  padding: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.ks-book-photo-edit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ks-book-photo-missing {
  font-size: 10px;
  padding: 6px;
  margin: 0;
}
.ks-book-photo-check {
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: flex-start;
  padding: 6px;
  cursor: pointer;
}
.ks-book-photo-check input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #3a3e39;
  background: #fff;
}
.ks-book-photo-badge {
  position: absolute;
  font:
    600 9px "Source Sans 3",
    sans-serif;
  letter-spacing: 0.5px;
  padding: 2px 5px;
  border-radius: 3px;
}
.ks-book-photo-lead {
  bottom: 4px;
  left: 6px;
  background: #ffffffe6;
  color: var(--ink);
}
.ks-book-photo-soft {
  top: 4px;
  right: 6px;
  background: #f7e4dd;
  color: #8a3d28;
}
.ks-book-photo-dup {
  bottom: 4px;
  right: 6px;
  background: #e4ecf5;
  color: #3a5678;
}
.ks-book-photo-dupes {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin-top: 8px;
}
.ks-book-photo-dupes p {
  margin: 0;
}
.ks-book-photo-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
}
.ks-book-photo-actions .ks-link {
  min-height: 28px;
  padding: 2px 0;
  font-size: 12px;
}
.ks-book-photo-actions .ks-link:nth-child(2) {
  color: var(--muted);
}
.ks-book-photo-moves {
  display: flex;
}
.ks-book-photo-moves button {
  min-width: 26px;
  min-height: 28px;
  padding: 0 3px;
  border: 0;
  background: none;
  color: var(--muted);
  font: inherit;
  cursor: pointer;
}
.ks-book-photo-moves button:disabled {
  opacity: 0.35;
  cursor: default;
}
.ks-photo-drag {
  cursor: grab;
}
.ks-book-photo-moves .ks-photo-drag {
  min-width: 20px;
  font-size: 11px;
  color: #b5ada1;
}
.ks-book-photo-card {
  width: 112px;
}
.ks-book-photo-actions .ks-link {
  font-size: 11px;
}
.ks-book-photo-moves button {
  min-width: 22px;
  font-size: 12px;
}
.ks-book-photo-warning {
  margin: 8px 0 0;
  font-size: 12px;
}
.ks-photo-style-controls {
  display: grid;
  gap: 10px;
}
.ks-photo-style-controls .ks-segment {
  flex-wrap: wrap;
}
.ks-book-photo-card :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.ks-book-layouts {
  display: grid;
  gap: 8px;
  margin: 4px 0;
}
.ks-book-layouts .ks-field-heading .ks-link {
  min-height: 28px;
  padding: 0;
  font-size: 12px;
}
.ks-book-layouts h4,
.ks-book-layouts p {
  margin: 0;
}
.ks-book-layout-options {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 8px;
}
.ks-book-layout-pick {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 10px;
  text-align: left;
  border: 1px solid #d9d2c7;
  border-radius: 10px;
  background: #fbfaf6;
  color: #333e35;
  cursor: pointer;
}
.ks-book-layout-pick small {
  font-size: 12px;
  line-height: 1.4;
  color: #6b6f65;
}
.ks-book-layout-pick[aria-pressed="true"] {
  border-color: #a65436;
  box-shadow: inset 0 0 0 1px #a65436;
  background: #f5eee5;
}
.ks-book-layout-pick:focus-visible {
  outline: 2px solid #a65436;
  outline-offset: 3px;
}
.ks-layout-sketch {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
  height: 40px;
  padding: 0;
  background: transparent;
  border-radius: 4px;
}
.ks-layout-sketch > span {
  background: #879887;
  border-radius: 2px;
}
.ks-layout-full {
  grid-template-columns: 1fr;
}
.ks-layout-bleed {
  grid-template-columns: 1fr;
  gap: 0;
}
.ks-layout-bleed > span {
  background: #6f826f;
  border-radius: 4px;
}
.ks-layout-grid {
  grid-template-columns: repeat(3, 1fr);
}
.ks-layout-hero {
  grid-template-columns: 2fr 1fr;
}
.ks-layout-hero > span:first-child {
  grid-row: span 2;
}
.ks-layout-text {
  grid-template-columns: 1fr;
}
.ks-layout-sketch i {
  background: repeating-linear-gradient(
    to bottom,
    #a3a69c 0 2px,
    transparent 2px 8px
  );
  margin: 3px;
}

/* Reprint / cancel / partner reassurances under an order total (Get it step). */
.ks-order-trust {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #e3d9ca;
}
.ks-trust-line {
  display: flex;
  gap: 8px;
  align-items: baseline;
  margin: 6px 0;
  color: #5b544c;
  font-size: 12px;
  line-height: 1.5;
}
.ks-trust-check {
  color: #3b5a2f;
  font-weight: 600;
  flex: 0 0 auto;
}

/* "Hold it" — a CSS-only view of the finished object in Review (physical-view.js). */
.ks-hold {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}
.ks-hold-stage {
  width: 100%;
  min-height: 360px;
  display: grid;
  place-items: center;
  padding: 48px 24px 36px;
  border-radius: 8px;
  background: linear-gradient(#efe7db, #e3d9ca);
  perspective: 1200px;
}
.ks-hold-caption {
  margin: 0;
  color: #5b544c;
  font-size: 12px;
  text-align: center;
}
/* Book: cover, a spine face and a page-edge face with real proportional depth. */
.ks-hold-book {
  position: relative;
  width: 220px;
  height: 300px;
  transform-style: preserve-3d;
  transform: rotateX(8deg) rotateY(-22deg);
}
.ks-hold-book-cover {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 2px 5px 5px 2px;
  background: #fff;
  border-left: 4px solid #d9cfc1;
  box-shadow: 0 22px 44px rgba(40, 30, 20, 0.4);
  transform: translateZ(calc(var(--spine, 6px) / 2));
}
.ks-hold-book-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ks-hold-book-spine {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: var(--spine, 6px);
  transform-origin: left center;
  transform: rotateY(-90deg) translateX(calc(var(--spine, 6px) / -2));
  background: linear-gradient(#c9bfae, #e9e2d6);
}
.ks-hold-book-edge {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: var(--spine, 6px);
  transform-origin: right center;
  transform: rotateY(90deg) translateX(calc(var(--spine, 6px) / 2));
  background: repeating-linear-gradient(
    to right,
    #fff,
    #fff 1px,
    #e3d9ca 1px,
    #e3d9ca 2px
  );
}
/* Cards: a fanned stack. */
.ks-hold-cards {
  position: relative;
  width: 240px;
  height: 170px;
}
.ks-hold-card {
  position: absolute;
  top: 24px;
  left: 8px;
  width: 180px;
  height: 120px;
  border: 3px solid #fff;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(40, 30, 20, 0.3);
}
.ks-hold-card-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Squares: on a fridge door. */
.ks-hold-fridge {
  position: relative;
  width: 260px;
  height: 300px;
  border-radius: 6px;
  background: linear-gradient(#f4f4f2, #dedcd6);
  box-shadow: 0 16px 36px rgba(40, 30, 20, 0.25);
  padding: 26px 20px;
}
.ks-hold-fridge-handle {
  position: absolute;
  top: 26px;
  right: 12px;
  width: 6px;
  height: 90px;
  border-radius: 3px;
  background: #b9ad9d;
}
.ks-hold-fridge-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.ks-hold-square {
  aspect-ratio: 1;
  border: 3px solid #fff;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 3px 8px rgba(40, 30, 20, 0.22);
}
.ks-hold-square-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (prefers-reduced-motion: reduce) {
  .ks-hold-book {
    transform: rotateX(4deg) rotateY(-14deg);
  }
}

/* "Flip through your book before it exists" — spread viewer built on StPageFlip
   (js/vendor/page-flip-2.0.7.mjs). We own the chrome (controls, stage, rail);
   the library owns the page-turn. */
.ks-flip {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.ks-flip:focus-visible {
  outline: 2px solid #b5563b;
  outline-offset: 4px;
  border-radius: 12px;
}
.ks-flip-controls {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.ks-flip-play {
  color: #b5563b;
  font-weight: 500;
}
.ks-flip-position {
  color: #5b544c;
  font-size: 13px;
  margin-left: auto;
}
.ks-flip-nav {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #d9cfc1;
  background: #fff;
  color: #2a2622;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.ks-flip-next {
  background: #2a2622;
  color: #f7f1e8;
  border-color: #2a2622;
}
.ks-flip-nav:disabled {
  opacity: 0.4;
  cursor: default;
}
.ks-flip-stage {
  display: grid;
  place-items: center;
  min-height: 540px;
  padding: 48px 24px;
  border-radius: 12px;
  background: linear-gradient(#f2ece2, #e3d9ca);
  overflow: hidden;
}
.ks-flip-book {
  touch-action: pan-y;
}
/* Give the closed book a spine and a lift so the cover reads as a real book. */
.ks-flip-book .stf__parent {
  box-shadow: 0 30px 60px rgba(40, 30, 20, 0.35);
}
.ks-flip-rail {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 6px;
}
.ks-flip-thumb {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.ks-flip-thumb-strip {
  display: flex;
  height: 64px;
  padding: 6px;
  gap: 2px;
  background: #fff;
  border: 2px solid #e3d9ca;
  border-radius: 6px;
}
.ks-flip-thumb[aria-current="true"] .ks-flip-thumb-strip {
  border-color: #2a2622;
}
.ks-flip-thumb-strip img {
  height: 100%;
  width: auto;
  object-fit: cover;
}
.ks-flip-thumb-blank {
  width: 40px;
  height: 100%;
  background: #efe7db;
}
.ks-flip-thumb-label {
  font-size: 11px;
  color: #8a8178;
}
.ks-flip-thumb[aria-current="true"] .ks-flip-thumb-label {
  color: #2a2622;
}
/* StPageFlip (MIT) — src/Style/stPageFlip.css, unmodified. */
.stf__parent {
  position: relative;
  display: block;
  box-sizing: border-box;
  transform: translateZ(0);
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.sft__wrapper {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}
.stf__parent canvas {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.stf__block {
  position: absolute;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  perspective: 2000px;
}
.stf__item {
  display: none;
  position: absolute;
  transform-style: preserve-3d;
}
.stf__outerShadow,
.stf__innerShadow,
.stf__hardShadow,
.stf__hardInnerShadow {
  position: absolute;
  left: 0;
  top: 0;
}

/* Book review: readable proofs, explicit quality state and usable controls. */
.ks-review-book,
.ks-make,
.ks-book-inspector {
  --muted: #5b6259;
}
.ks-review-grid.ks-review-pages[data-product="book"][data-view="pages"] {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 24px 18px;
}
.ks-review-pages .ks-review-caption {
  font-size: 14px;
  align-items: flex-start;
}
.ks-review-pages .ks-review-caption > span {
  white-space: normal;
  overflow-wrap: anywhere;
}
.ks-review-pages .ks-review-caption .ks-link,
.ks-review-details,
.ks-book-inspector-footer .ks-link {
  min-height: 44px;
  font-size: 14px;
}
.ks-review-book .ks-segment {
  flex-wrap: wrap;
  margin: 12px 0;
}
.ks-review-book .ks-segment button,
.ks-hold-controls button,
.ks-quality-queue button,
.ks-book-photo-actions .ks-link,
.ks-photo-remedies .ks-link,
.ks-book-photo-moves button,
.ks-book-inspector-tools .ks-button,
.ks-flip-nav {
  min-width: 44px;
  min-height: 44px;
}
.ks-review-book button:focus-visible,
.ks-make button:focus-visible,
.ks-book-inspector :focus-visible {
  outline: 3px solid #74402f;
  outline-offset: 3px;
}
.ks-quality-badge {
  display: block;
  margin-top: 8px;
  padding: 5px 8px;
  background: #f8e6d8;
  color: #713e24;
  font-size: 13px;
  border-radius: 4px;
}
.ks-quality-reviewed {
  color: #315336;
  background: #e4ede1;
}
.ks-quality-queue {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 16px;
  margin: 18px 0;
  border: 1px solid #c5ae95;
  border-radius: 6px;
  background: #faf1e7;
}
.ks-quality-queue > strong {
  flex-basis: 100%;
}
.ks-photo-resolution {
  font:
    13px/1.45 "Source Sans 3",
    sans-serif;
  margin: 8px 0;
  color: #4b554b;
}
.ks-photo-resolution[data-level="low"] {
  color: #85351f;
  font-weight: 600;
}
.ks-photo-remedies {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
}
.ks-print-details {
  display: grid;
  grid-template-columns: minmax(100px, 160px) minmax(0, 1fr);
  gap: 12px 24px;
  padding: 20px;
  background: #f0ece4;
  border-radius: 6px;
  font-size: 14px;
}
.ks-print-details dt {
  font-weight: 600;
}
.ks-print-details dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.ks-hold-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  width: 100%;
}
.ks-hold-scale-note {
  align-self: stretch;
  margin: 0;
}
.ks-counter[hidden] {
  display: none;
}
.ks-hold-book-stage {
  display: block;
  max-height: 75dvh;
  padding: 56px 56px 42px;
  overscroll-behavior: contain;
}
.ks-hold-measure {
  position: relative;
  margin-inline: auto;
}
.ks-hold-measure[hidden] {
  display: none;
}
.ks-hold-measure .ks-hold-book {
  width: 100%;
  max-width: none;
}
.ks-hold-book-stage.is-actual-size .ks-hold-book {
  transform: none;
}
.ks-hold-book-stage .ks-hold-book-cover {
  border-left: 0;
}
.ks-book-width,
.ks-book-height {
  position: absolute;
  display: grid;
  place-items: center;
  white-space: nowrap;
  color: #3f483d;
  font: 600 12px / 1.4 var(--font-sans, sans-serif);
}
.ks-book-width {
  left: 0;
  right: 0;
  top: -33px;
  height: 24px;
  border-bottom: 1px solid #5b6655;
  border-inline: 1px solid #5b6655;
}
.ks-book-height {
  top: 0;
  bottom: 0;
  left: -43px;
  width: 24px;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  border-left: 1px solid #5b6655;
  border-block: 1px solid #5b6655;
}
.ks-screen-calibration {
  width: 100%;
  min-width: 0;
  padding: 12px 16px;
  border: 1px solid #d0d4ca;
  border-radius: 6px;
}
.ks-screen-calibration summary {
  cursor: pointer;
  min-height: 44px;
  align-content: center;
}
.ks-screen-calibration input {
  display: block;
  width: min(100%, 360px);
  min-height: 44px;
}
.ks-screen-reference-well {
  overflow: auto;
  padding-block: 14px;
}
.ks-screen-reference {
  height: 32px;
  border: 2px solid #333e35;
  border-top: 0;
  box-sizing: border-box;
  text-align: center;
  font-size: 13px;
}
.ks-hold-stage {
  min-height: 460px;
  overflow: auto;
  scrollbar-gutter: stable;
}
.ks-hold-book {
  width: min(var(--book-width, 420px), 80vw);
  max-width: 100%;
  height: auto;
  aspect-ratio: var(--book-ratio, 0.707);
  transform: rotateX(5deg) rotateY(var(--book-angle, -18deg));
  flex-shrink: 0;
}
.ks-hold-book-photo {
  object-fit: contain;
}
.ks-hold-book[hidden],
.ks-cover-wrap[hidden],
.ks-hold-safe-guide[hidden] {
  display: none;
}
.ks-hold-safe-guide {
  position: absolute;
  inset: var(--safe-y) var(--safe-x);
  border: 2px dashed #713e24;
  box-shadow: 0 0 0 1px #fff;
  pointer-events: none;
}
.ks-hold-stage.is-enlarged .ks-hold-book {
  width: 900px;
  max-width: none;
}
.ks-cover-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 26px minmax(0, 1fr);
  width: min(100%, 1000px);
  align-items: stretch;
}
.ks-cover-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: white;
}
.ks-wrap-spine {
  display: grid;
  place-items: center;
  background: #ddd2c0;
  writing-mode: vertical-rl;
  font-size: 12px;
  color: #4c443a;
}
.ks-book-inspector-tools {
  gap: 8px;
  padding-inline: 16px;
}
.ks-book-inspector-tools select {
  min-height: 44px;
}
.ks-book-inspector-tools .ks-zoom-preset {
  flex: 0 1 130px;
}
.ks-zoom-status {
  font-size: 13px;
  color: #4b554b;
}
.ks-book-inspector-page {
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}
.ks-book-inspector-page img,
.ks-book-inspector-page.is-zoomed img {
  max-width: none;
  object-fit: contain;
  flex-shrink: 0;
}
.ks-book-inspector-page.is-zoomed {
  cursor: grab;
}
.ks-book-inspector-page.is-panning {
  cursor: grabbing;
  user-select: none;
}
.ks-book-inspector-footer {
  padding: 12px 16px;
}
.ks-flip-stage {
  min-height: 260px;
  padding: 24px 12px;
}
@media (max-width: 600px) {
  .ks-review-grid.ks-review-pages[data-product="book"][data-view="pages"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 10px;
  }
  .ks-review-pages .ks-review-caption {
    flex-direction: column;
    gap: 0;
  }
  .ks-print-details {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 16px;
  }
  .ks-print-details dd {
    margin-bottom: 12px;
  }
  .ks-book-inspector h2 {
    margin-inline: 16px;
    font-size: 18px;
  }
  .ks-book-inspector-label {
    min-width: 0;
    flex: 1;
  }
  .ks-book-inspector-page {
    height: min(45dvh, 480px);
    padding: 16px;
  }
  .ks-book-inspector-footer .ks-hint {
    font-size: 12px;
  }
  .ks-hold-stage {
    min-height: 280px;
    padding: 28px 16px;
  }
  .ks-hold-book-stage {
    padding: 56px 16px 42px 52px;
  }
  .ks-hold-controls {
    gap: 6px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ks-hold-book {
    transform: rotateY(var(--book-angle, 0deg));
  }
  .ks-review-book *,
  .ks-book-inspector * {
    scroll-behavior: auto;
    transition: none;
    animation: none;
  }
}

.ks-review-book > .ks-segment {
  display: flex;
  width: fit-content;
  max-width: 100%;
}

.ks-wrap-surface {
  position: relative;
  min-width: 0;
}
.ks-wrap-guide {
  display: none;
}
.ks-cover-wrap.show-guides .ks-wrap-guide {
  display: block;
}
.ks-stage:not(:disabled):not([aria-current]) {
  color: var(--ink);
}

/* Book editor: a large page canvas, focused inspector, and chapter filmstrip. */
.ks-editor-intro .ks-stage-sub { max-width: 70ch; }
.ks-editor-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 12px; }
.ks-editor-history { display: flex; gap: 6px; }
.ks-editor-toolbar button { min-height: 44px; }
.ks-make .ks-make-layout { display: flex; flex-direction: column; gap: 16px; margin-top: 0; }
.ks-make .ks-make-editor { display: grid; grid-template-columns: minmax(0, 1fr) 340px; width: 100%; gap: 0; align-items: stretch; border: 1px solid var(--line); border-radius: 12px; overflow: clip; background: #eee9df; }
.ks-make .ks-make-editor.ks-tools-hidden { grid-template-columns: minmax(0, 1fr); }
.ks-make .ks-make-preview { position: sticky; top: 12px; align-self: start; padding: 20px 24px 12px; width: 100%; box-sizing: border-box; }
.ks-make .ks-make-page { height: clamp(330px, 58svh, 640px); display: flex; align-items: center; justify-content: center; }
.ks-make .ks-make-page .ks-proof-image { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 1px; box-shadow: 0 7px 22px #30271926; }
.ks-make .ks-make-preview-label { min-height: 26px; margin-bottom: 12px; flex-wrap: wrap; gap: 6px 14px; color: #535a51; }
.ks-make .ks-make-page-nav { margin: 8px 0 0; min-height: 44px; }
.ks-make .ks-make-page-nav .ks-inline-actions { width: 100%; display: flex; justify-content: space-between; }
.ks-make .ks-make-page-nav button { min-height: 44px; }
.ks-make .ks-make-preview > .ks-hint { text-align: center; margin: 8px auto 0; max-width: 55ch; }
.ks-make .ks-make-controls { display: block; background: var(--white); border-left: 1px solid var(--line); padding: 20px 18px; min-width: 0; }
.ks-make .ks-inspector-heading { font-size: 23px; margin: 0 0 16px; }
.ks-editor-tabs { display: flex; gap: 2px; padding: 3px; background: #eee9df; border-radius: 8px; margin-bottom: 22px; }
.ks-editor-tab { flex: 1; min-width: 0; min-height: 44px; border: 0; border-radius: 6px; background: transparent; color: #535a51; padding: 8px 6px; font: inherit; font-weight: 600; cursor: pointer; }
.ks-editor-tab[aria-selected="true"] { background: var(--white); color: var(--accent); box-shadow: 0 1px 4px #30271920; }
.ks-editor-panel { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.ks-editor-panel > .ks-settings-fields { padding: 0; }
.ks-editor-panel .ks-book-layout-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ks-editor-panel .ks-book-photo-tray { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); }
.ks-editor-panel .ks-book-photo-card { width: auto; }
.ks-make .ks-make-rail { display: grid; grid-template-columns: minmax(0, 1fr) auto; flex: none; width: 100%; max-width: none; gap: 8px 16px; }
.ks-make .ks-filmstrip-heading { font-family: inherit; font-size: 14px; font-weight: 600; margin: 0; align-self: center; }
.ks-make .ks-make-rail > .ks-button { grid-column: 2; grid-row: 1; min-height: 44px; }
.ks-editor-filmstrip { grid-column: 1 / -1; display: flex; align-items: stretch; gap: 10px; overflow-x: auto; padding: 4px 3px 12px; scrollbar-width: thin; }
.ks-make .ks-rail-chapters { display: flex; flex: none; gap: 10px; max-height: none; overflow: visible; }
.ks-make .ks-rail-cover { flex: 0 0 130px; width: 130px; flex-direction: column; align-items: stretch; text-align: left; padding: 10px; gap: 8px; }
.ks-make .ks-rail-cover-thumb { width: 100%; height: 76px; object-fit: cover; border-radius: 3px; background: #e9e2d6; }
.ks-make .ks-rail-chapters .ks-item { flex: 0 0 160px; width: 160px; display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.ks-make .ks-rail-chapters .ks-item-activate { display: grid; grid-template-columns: 22px minmax(0, 1fr); width: 100%; min-width: 0; padding: 10px; gap: 8px; }
.ks-make .ks-rail-chapters .ks-item-activate > img,
.ks-make .ks-rail-chapters .ks-rail-thumb-empty { grid-column: 1 / -1; grid-row: 1; width: 100%; height: 76px; object-fit: cover; }
.ks-make .ks-rail-chapters .ks-row-copy { min-width: 0; }
.ks-make .ks-rail-cover .ks-row-title,
.ks-make .ks-rail-chapters .ks-row-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-make .ks-rail-chapters .ks-row-meta { font-size: 11px; }
.ks-make .ks-rail-chapters .ks-reorder { display: flex; flex-direction: row; justify-content: flex-end; border-top: 1px solid var(--line); margin-top: auto; padding: 0 6px; }
.ks-make .ks-rail-chapters .ks-reorder button { min-width: 44px; min-height: 44px; }
.ks-make .ks-rail-cover[aria-current="true"], .ks-make .ks-rail-chapters .ks-item[data-active="true"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); background: #f5ebe3; }
@media (max-width: 900px) {
  .ks-make .ks-make-editor { grid-template-columns: minmax(0, 1fr) 310px; }
  .ks-make .ks-make-preview { padding: 16px; }
}
@media (max-width: 700px) {
  .ks-make .ks-make-editor { display: block; overflow: visible; }
  .ks-make .ks-make-preview { position: sticky; top: 0; z-index: 2; padding: 10px 12px 4px; background: #eee9df; border-radius: 12px 12px 0 0; }
  .ks-make .ks-make-page { height: clamp(180px, 30svh, 280px); }
  .ks-make .ks-make-preview-label { font-size: 11px; min-height: 16px; margin-bottom: 6px; }
  .ks-make .ks-make-preview > .ks-hint:last-child { display: none; }
  .ks-make .ks-make-page-nav { min-height: 0; margin-top: 4px; }
  .ks-make .ks-make-controls { border-left: 0; border-top: 1px solid var(--line); border-radius: 0 0 12px 12px; padding: 16px; }
  .ks-make .ks-inspector-heading { font-size: 21px; margin-bottom: 12px; }
  .ks-editor-panel input:not([type="checkbox"]), .ks-editor-panel textarea, .ks-editor-panel select { font-size: 16px; scroll-margin-top: 42svh; }
  .ks-editor-panel .ks-book-layout-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ks-editor-toolbar { gap: 8px; }
  .ks-editor-toolbar button { padding-inline: 10px; }
}
@media (max-height: 500px) and (max-width: 700px) {
  .ks-make .ks-make-preview { position: static; }
  .ks-make .ks-make-page { height: 150px; }
}
.ks-editor-toolbar .ks-page-mode { margin-left: auto; }
.ks-make .ks-make-page.ks-page-pair { gap: 8px; }
.ks-make .ks-make-page.ks-page-pair .ks-proof-image { max-width: calc(50% - 4px); }
@media (min-width: 701px) {
  .ks-editing-book { padding: 12px; }
  .ks-editing-book .ks-app { max-width: 1440px; }
  .ks-editing-book .ks-header { padding: 8px 18px; gap: 12px; }
  .ks-editing-book .ks-stage { font-size: 12px; gap: 4px; padding-inline: 8px; }
  .ks-editing-book .ks-home { gap: 10px; }
  .ks-editing-book .ks-home .ks-link { max-width: 150px; }
  .ks-editing-book .ks-editor-intro { display: flex; align-items: baseline; gap: 20px; }
  .ks-editing-book .ks-editor-intro h1 { font-size: 25px; white-space: nowrap; margin: 0; }
  .ks-editing-book .ks-editor-intro p { font-size: 13px; margin: 0; }
  .ks-editing-book .ks-editor-toolbar { margin-top: 12px; }
  .ks-make .ks-make-editor { flex: none; height: clamp(300px, calc(100svh - 500px), 660px); }
  .ks-make .ks-make-preview { position: static; height: 100%; display: flex; flex-direction: column; overflow: hidden; }
  .ks-make .ks-make-page { height: auto; flex: 1; min-height: 0; }
  .ks-make .ks-make-controls { overflow-y: auto; }
  .ks-make .ks-editor-tabs { position: sticky; top: -20px; z-index: 3; box-shadow: 0 -20px 0 var(--white); }
  .ks-make .ks-rail-cover-thumb, .ks-make .ks-rail-chapters .ks-item-activate > img, .ks-make .ks-rail-chapters .ks-rail-thumb-empty { height: 54px; }
}
@media (max-width: 700px) {
  .ks-editing-book .ks-header { padding-block: 8px; gap: 4px; }
  .ks-editing-book .ks-stage { font-size: 0; gap: 0; min-width: 44px; justify-content: center; }
  .ks-editing-book .ks-stage[aria-current="step"] { font-size: 13px; gap: 6px; }
  .ks-editing-book .ks-editor-intro h1 { font-size: 23px; margin: 0; }
  .ks-editing-book .ks-editor-intro p { display: none; }
  .ks-editing-book .ks-editor-toolbar { margin-top: 8px; }
  .ks-editor-toolbar .ks-page-mode { display: none; }
  .ks-make .ks-make-page.ks-page-pair .ks-proof-image { max-width: 100%; }
  .ks-make .ks-make-page.ks-page-pair .ks-proof-image + .ks-proof-image { display: none; }
}

.ks-editor-panel .ks-book-photo-actions { display: grid; grid-template-columns: 1fr 1fr; }
.ks-editor-panel .ks-book-photo-moves { grid-column: 1 / -1; justify-content: space-between; }
@media (min-width: 701px) {
  .ks-make .ks-rail-chapters .ks-row-meta { display: none; }
  .ks-make .ks-rail-cover-thumb, .ks-make .ks-rail-chapters .ks-item-activate > img, .ks-make .ks-rail-chapters .ks-rail-thumb-empty { height: 44px; }
}
@media (min-width: 1001px) {
  .ks-editing-book .ks-make { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 24px; }
  .ks-editing-book .ks-editor-intro { display: block; align-self: center; }
  .ks-editing-book .ks-editor-intro p { max-width: 68ch; margin-top: 4px; }
  .ks-editing-book .ks-editor-toolbar { grid-column: 2; grid-row: 1; margin: 0; align-self: center; }
  .ks-editing-book .ks-make-layout, .ks-editing-book .ks-quality-queue { grid-column: 1 / -1; }
  .ks-make .ks-make-editor { height: clamp(340px, calc(100svh - 455px), 660px); }
}
@media (min-width: 701px) {
  .ks-make .ks-make-editor.ks-tools-hidden { height: clamp(420px, calc(100svh - 245px), 900px); }
}