html, body {
  margin: 0;
  padding: 0;
  background: #ece5d8;
  font-family: Arial, Helvetica, sans-serif;
}
.ppv-shell {
  min-height: 100vh;
  background: radial-gradient(circle at top, #f6f1e8 0%, #ece5d8 55%, #e7decf 100%);
}
.ppv-message {
  max-width: 920px;
  margin: 30px auto;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #d8cfc0;
  color: #4b463f;
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}
.ppv-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  background: rgba(250,247,241,.96);
  border-bottom: 1px solid #d8cfc0;
  box-shadow: 0 4px 14px rgba(0,0,0,.05);
}
.ppv-toolbar-group { display:flex; align-items:center; gap:8px; min-width:0; }
.ppv-toolbar-group-center { flex:1 1 auto; justify-content:center; }
.ppv-toolbar-group-right { justify-content:flex-end; }
.ppv-btn {
  border: 1px solid #b8ab97;
  background: linear-gradient(to bottom, #fffdf8, #f4ecdf);
  color: #4b463f;
  padding: 9px 14px;
  cursor: pointer;
  border-radius: 7px;
  font-size: 14px;
  line-height: 1.2;
}
.ppv-btn[disabled] { opacity:.45; cursor:default; }
.ppv-btn-zoom { min-width:68px; }
.ppv-counter { font-size:14px; color:#635b50; font-weight:bold; text-align:center; }
.ppv-stage-wrap {
  max-width: 1360px;
  margin: 0 auto;
  padding: 24px 18px 36px;
  overflow: auto;
}
.ppv-status { text-align:center; color:#6d6559; padding: 8px 0 18px; }
.ppv-stage {
  display:flex;
  gap:28px;
  justify-content:center;
  align-items:flex-start;
  flex-wrap:nowrap;
  min-height:420px;
  width:max-content;
  min-width:100%;
  transition: transform .18s ease;
}
.ppv-page {
  position:relative;
  background:#fbfaf6;
  box-shadow: 0 20px 50px rgba(0,0,0,.16), 0 2px 10px rgba(111,90,59,.08);
  border:1px solid #ddd4c7;
  border-radius:4px;
  padding:10px;
}
.ppv-page::before {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(to right, rgba(0,0,0,.04), transparent 18%, transparent 82%, rgba(0,0,0,.03));
}
.ppv-page-inner { position:relative; }
.ppv-canvas { display:block; max-width:none; height:auto; }
.ppv-watermark {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  user-select:none;
  font-size:44px;
  letter-spacing:1px;
  color:rgba(90,90,90,.14);
  transform:rotate(-29deg);
}
.ppv-spine {
  width:14px;
  align-self:stretch;
  background: linear-gradient(to right, rgba(0,0,0,.08), rgba(255,255,255,.55), rgba(0,0,0,.08));
  border-radius:8px;
  box-shadow: inset 0 0 6px rgba(0,0,0,.05);
}
@media (max-width: 1080px) {
  .ppv-toolbar { flex-wrap:wrap; }
  .ppv-toolbar-group-center { order:3; width:100%; }
}
@media (max-width: 900px) {
  .ppv-stage { flex-direction:column; align-items:center; gap:20px; }
  .ppv-spine { display:none; }
  .ppv-toolbar-group-right { flex-wrap:wrap; }
}