.photo-system-picker {
  background: #eff8ff;
  color: #102a56;
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}
.photo-system-picker .ix-status {
  background: #fff;
}
.photo-system-header {
  height: 57px;
  padding: 0 12px 0 34px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 40px;
  align-items: start;
  background: #fff;
}
.photo-system-header button {
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 4px;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  color: inherit;
}
.photo-system-header svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: #2878f0;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.photo-system-header [data-act="back"] svg {
  stroke: #263445;
}
.photo-system-header h1 {
  min-width: 0;
  margin: 2px 0 0;
  color: #08245c;
  font-size: 20px;
  line-height: 28px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.photo-system-tabs {
  min-height: 50px;
  padding: 0 16px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  align-items: center;
  background: #fff;
}
.photo-system-tabs button {
  min-height: 38px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  color: #78869b;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
}
.photo-system-tabs button.on {
  background: #eaf4ff;
  color: #2878f0;
  box-shadow: inset 0 -1px 2px rgba(83,177,253,.35);
}
.photo-system-content {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 12px 96px;
  background: #eff8ff;
}
.photo-sheet button, .photo-pickbar button, .editor-tools button, .filter-row button, .photo-system-picker button {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.photo-access-note {
  margin: 0 4px 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: #fff;
  color: #5f7188;
  font-size: 14px;
  line-height: 1.38;
  box-shadow: inset 0 0 0 1px #e6eaf0;
}
.photo-access-note button {
  float: right;
  color: #2878f0;
  font-weight: 800;
}
.photo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.album-list { display: grid; gap: 12px; }
.album-list button {
  min-height: 72px;
  padding: 0 18px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  color: #102a56;
  box-shadow: inset 0 0 0 1px #e6eaf0;
}
.album-list b { font-size: 18px; }
.album-list span { color: #2878f0; font-weight: 800; }
.photo-system-picker .photo-tile {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  display: grid;
  place-items: end start;
  padding: 8px;
  border: 0;
  border-radius: 12px;
  background: var(--paint), var(--bg);
  color: #fff;
  text-shadow: 0 1px 3px #000;
  box-shadow: 0 6px 14px rgba(16,42,86,.14);
}
.photo-system-picker .photo-tile.on { outline: 3px solid #1570ef; outline-offset: -3px; }
.photo-tile b {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #1570ef;
  color: #fff;
}
.photo-tile b svg {
  width: 20px;
  height: 20px;
  stroke: #fff;
}
.photo-pickbar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 4;
  min-height: 86px;
  padding: 12px 16px 24px;
  border-radius: 0;
  display: grid;
  grid-template-columns: 44px 1fr 1.3fr 1.15fr;
  gap: 8px;
  align-items: center;
  background: #fff;
  color: #2878f0;
  box-shadow: 0 -8px 24px rgba(16,42,86,.08);
}
.photo-pickbar button:last-child {
  height: 52px;
  border-radius: 16px;
  background: #2878f0;
  color: #fff;
  font-weight: 800;
}
.photo-paper {
  min-height: 322px;
  display: grid;
  place-items: center;
}

.photo-preview-exact {
  background: #e5e7ef;
  color: #102a56;
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.photo-preview-exact .ix-status {
  background: #fff;
}

.photo-preview-toolbar {
  height: 57px;
  padding: 0 10px 0 34px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 40px 40px;
  align-items: start;
  background: #fff;
}

.photo-preview-toolbar button {
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 4px;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  color: inherit;
  touch-action: manipulation;
}

.photo-preview-toolbar svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: #1570ef;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.photo-preview-toolbar [data-act="back"] svg {
  stroke: #263445;
}

.photo-preview-toolbar h1 {
  min-width: 0;
  margin: 2px 0 0;
  color: #08245c;
  font-size: 20px;
  line-height: 28px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.photo-preview-toolbar .photo-preview-icon {
  justify-self: end;
}

.photo-preview-toolbar [data-act="edit"] {
  margin-right: 16px;
}

.photo-preview-body {
  flex: 1;
  min-height: 0;
  padding: 0 16px 24px;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  row-gap: 20px;
  overflow: hidden;
  background: #e5e7ef;
}

.photo-sheet-area {
  position: relative;
  min-height: 0;
}

.photo-paper-back,
.photo-paper-sheet {
  position: absolute;
  left: 28px;
  right: 28px;
  top: 20px;
  bottom: 20px;
  border-radius: 4px;
  background: #fff;
}

.photo-paper-back {
  z-index: 0;
  opacity: .75;
  transform: translate(9px, -9px) rotate(2deg);
  box-shadow: 0 2px 4px rgba(16, 42, 86, .16);
}

.photo-paper-sheet {
  z-index: 1;
  display: grid;
  place-items: center;
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(16, 42, 86, .18);
}

.photo-pdf-page {
  width: 100%;
  height: 100%;
  padding: 24px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  background: #fff;
}

.photo-pdf-page .photo-art {
  width: min(82%, 260px);
  max-height: 86%;
  aspect-ratio: 9 / 14;
  border-radius: 4px;
  box-shadow: none;
}

.photo-preview-exact .page-pill {
  position: absolute;
  left: 50%;
  bottom: 36px;
  z-index: 3;
  transform: translateX(-50%);
  min-height: 40px;
  padding: 8px 16px;
  border-radius: 100px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(16, 24, 40, .9);
  color: #fff;
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(16, 42, 86, .18);
}

.photo-preview-exact .page-pill svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #fff;
}

.photo-preview-exact .page-nav {
  position: absolute;
  top: 50%;
  z-index: 4;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 8px;
  border: 1px solid #ecedf3;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #fff;
  color: #007aff;
  transform: translateY(-50%);
  box-shadow: 0 8px 20px rgba(16, 42, 86, .14);
}

.photo-preview-exact .page-nav.left {
  left: 12px;
}

.photo-preview-exact .page-nav.right {
  right: 12px;
}

.photo-preview-exact .page-nav:disabled {
  opacity: .4;
}

.photo-preview-exact .page-nav svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.photo-preview-printbar {
  width: 100%;
  min-width: 0;
}

.photo-preview-exact .print-summary {
  width: max-content;
  max-width: 100%;
  min-height: 30px;
  margin: 0 0 12px;
  padding: 6px 12px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #e7f6ee;
  color: #12b76a;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
}

.photo-preview-exact .print-summary svg {
  width: 18px;
  height: 18px;
  stroke: #12b76a;
}

.photo-preview-exact .preview-options {
  margin: 0;
  padding: 4px 16px;
  border-radius: 16px;
  display: grid;
  gap: 0;
  background: #fff;
  box-shadow: inset 0 -1px 2px rgba(16, 42, 86, .16), 0 6px 16px rgba(16, 42, 86, .10);
}

.photo-preview-exact .preview-options p {
  min-height: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #edf1f6;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #788697;
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
}

.photo-preview-exact .preview-options p:last-child {
  border-bottom: 0;
}

.photo-preview-exact .preview-options span {
  flex: 1;
  min-width: 0;
}

.photo-preview-exact .preview-options b {
  min-width: 0;
  color: #102a56;
  text-align: center;
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
}

.photo-preview-exact .preview-options button {
  border: 0;
  background: transparent;
  color: #102a56;
  font: inherit;
}

.photo-preview-exact .quantity-selector {
  padding: 0;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  background: #eff8ff;
  font-style: normal;
}

.photo-preview-exact .quantity-selector b {
  padding: 0 10px;
}

.photo-preview-exact .preview-options .quantity-selector .qty {
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #d1e9ff;
  color: #102a56;
  box-shadow: inset 0 -1px 2px rgba(46, 144, 250, .38);
}

.photo-preview-exact .preview-options .quantity-selector .qty:disabled {
  opacity: 1;
}

.photo-preview-exact .preview-options .quantity-selector .qty svg {
  width: 10px;
  height: 10px;
  fill: #102a56;
  stroke: none;
}

.photo-preview-exact .color-segment {
  padding: 3px;
  border-radius: 10px;
  display: inline-flex;
  gap: 3px;
  background: #eff4fa;
  font-style: normal;
}

.photo-preview-exact .preview-options .color-segment [data-color] {
  min-width: 54px;
  min-height: 32px;
  padding: 6px 16px;
  border-radius: 8px;
  color: #788697;
  font-size: 14px;
  background: transparent;
}

.photo-preview-exact .preview-options .color-segment [data-color].on {
  background: #1570ef;
  color: #fff;
}

.photo-preview-exact .preview-options .page-size-control {
  min-height: 32px;
  padding: 4px 0 4px 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #102a56;
  font-size: 16px;
  font-weight: 400;
}

.photo-preview-exact .preview-options .page-size-control svg {
  width: 24px;
  height: 24px;
  fill: #1570ef;
  stroke: none;
}

.photo-preview-exact .doc-print {
  position: static;
  width: 100%;
  min-height: 52px;
  margin-top: 16px;
  border: 0;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  background: radial-gradient(circle at 14% 18%, #84caff 0, #68b4fb 25%, #4d9df7 50%, #3187f3 75%, #1570ef 100%);
  font-size: 16px;
  font-weight: 700;
  box-shadow: inset 0 -1px 2px rgba(16, 42, 86, .35);
}

.photo-preview-exact .doc-print svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.5;
}

.photo-preview-exact .doc-sheet,
.photo-preview-exact .print-overlay,
.photo-preview-exact .print-paywall {
  position: absolute;
}

.photo-preview-exact .photo-paper-sheet > strong {
  position: absolute;
  z-index: 4;
}
.photo-art {
  position: relative;
  width: min(88%, 250px);
  aspect-ratio: 9 / 14;
  border-radius: 4px;
  display: grid;
  place-items: end center;
  padding: 18px;
  background: var(--paint), var(--bg);
  color: #fff;
  font-weight: 800;
  text-shadow: 0 1px 4px #000;
}
.photo-paper strong, .photo-editor-canvas strong {
  position: absolute;
  top: 18%;
  left: 50%;
  transform: translateX(-50%);
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,.52);
  color: #fff;
  font-size: 20px;
}
.photo-editor-canvas { position: relative; flex: 1; display: grid; place-items: center; overflow: hidden; background: #eff8ff; }
.photo-editor-canvas .photo-art { width: 78%; max-height: 100%; }
.photo-editor-canvas.b\&w .photo-art { filter: grayscale(1); }
.photo-editor-canvas.super .photo-art, .photo-editor-canvas.miracle .photo-art { filter: saturate(1.55) contrast(1.08); }
.photo-editor-canvas.contrast .photo-art { filter: contrast(1.55); }
.photo-editor-canvas.grayscale .photo-art { filter: grayscale(1); }
.photo-editor-canvas.negative .photo-art { filter: invert(1); }
.photo-editor-canvas.blend .photo-art { filter: sepia(.35) hue-rotate(170deg); }
.editor-tools { height: 86px; display: grid; grid-template-columns: repeat(3, 1fr); background: #fff; }
.editor-tools button { color: #2478f2; font-size: 17px; }
.editor-tools button.on { font-weight: 800; }
.filter-row { min-height: 122px; padding: 16px 14px 40px; display: flex; gap: 10px; overflow: auto; background: #fff; }
.filter-row button { min-width: 88px; min-height: 54px; border-radius: 18px; background: #f0f7ff; color: #2478f2; }
.filter-row button.on { background: #2478f2; color: #fff; }
.text-plus { position: absolute; right: 24px; bottom: 112px; width: 64px; height: 64px; border: 0; border-radius: 50%; background: #2478f2; color: #fff; font-size: 42px; }
.text-controls{position:absolute;inset:auto 0 0;z-index:3;padding:14px 16px 18px;display:grid;gap:12px;background:#fff}.text-controls>button{justify-self:end;min-width:76px;min-height:44px;border:0;border-radius:12px;background:#2478f2;color:#fff;font:inherit;font-weight:800}.text-controls div{display:flex;gap:10px;overflow:auto}.text-controls div button{min-width:44px;min-height:44px;border:0;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #d1e0ef}.text-controls div button.on{box-shadow:inset 0 0 0 3px #fff,0 0 0 4px #2478f2}
.text-input { min-height: 54px; border: 0; border-radius: 14px; padding: 0 14px; background:#f3f8ff; font-size: 30px; outline:0; }
.editor-toolbar { grid-template-columns: 42px minmax(0,1fr) 86px; }
.editor-toolbar [data-act="save"] { min-width: 76px; height: 40px; border-radius: 14px; background: #2478f2; color: #fff; font-weight: 800; }
.photo-option-sheet{position:absolute;inset:0;z-index:6;display:flex;align-items:flex-end;background:rgba(15,23,42,.28)}.photo-option-sheet section{position:relative;width:100%;padding:24px 18px 28px;border-radius:26px 26px 0 0;background:#fff;color:#102a56;box-shadow:0 -16px 38px rgba(15,23,42,.16)}.photo-option-sheet h2{margin:0 46px 14px 0;font-size:22px}.photo-option-sheet button{width:100%;min-height:54px;margin-top:10px;border:0;border-radius:16px;background:#eef6ff;color:#102a56;font:inherit;font-weight:800}.photo-option-sheet [data-act="closePickerSheet"]{position:absolute;top:14px;right:14px;width:40px;min-height:40px;padding:0;font-size:25px}
.draw-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.draw-layer path{fill:none;stroke-linecap:round;stroke-linejoin:round}.undo-redo{position:absolute;top:18px;left:50%;z-index:2;display:flex;gap:22px;transform:translateX(-50%)}.undo-redo button{width:60px;height:60px;border:0;border-radius:50%;background:#e5e7eb;color:#94a3b8;font-size:30px}.undo-redo button:not(:disabled){background:#fff;color:#2478f2;box-shadow:0 2px 10px rgba(15,23,42,.14)}.draw-hint{position:absolute;bottom:22px;margin:0;padding:8px 14px;border-radius:99px;background:rgba(16,42,86,.72);color:#fff;font-size:13px}.drawing-panel{min-height:250px;padding:22px 22px 34px;display:grid;gap:16px;background:#fff;color:#102a56}.drawing-panel b{font-size:19px}.drawing-panel input{width:100%;accent-color:#2478f2}.drawing-panel div{display:flex;justify-content:space-between;gap:10px}.drawing-panel button{width:40px;height:40px;border:0;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px #fff,0 0 0 5px #d9e2ec}.drawing-panel button.on{box-shadow:0 0 0 4px #fff,0 0 0 7px #2478f2}
.photo-exit{position:absolute;inset:0;z-index:8;display:grid;place-items:center;padding:28px;background:rgba(15,23,42,.45)}.photo-exit section{width:min(100%,320px);padding:24px 20px 18px;border-radius:22px;display:grid;gap:12px;background:#fff;color:#102a56;text-align:center;box-shadow:0 18px 42px rgba(15,23,42,.24)}.photo-exit div{width:72px;height:72px;margin:auto;border-radius:22px;background:linear-gradient(135deg,#fee2e2,#fff),linear-gradient(#ef4444,#ef4444);box-shadow:inset 0 0 0 2px #fecaca}.photo-exit h2{margin:0;font-size:23px}.photo-exit p{margin:0 0 8px;color:#64748b;line-height:1.35}.photo-exit button{min-height:50px;border:0;border-radius:16px;font:inherit;font-weight:800}.photo-exit [data-act="leaveEditor"]{background:#ef4444;color:#fff}.photo-exit [data-act="cancelExit"]{background:#2478f2;color:#fff}