/* A compact editing sheet: the photograph stays above its tools. */
.app-sheet.memory-studio-dialog {
  --studio-preview-height: clamp(158px, 27dvh, 252px);
  width: min(100%, 480px);
  height: min(860px, calc(var(--studio-viewport-height, 100dvh) - 8px));
  max-height: min(860px, calc(var(--studio-viewport-height, 100dvh) - 8px));
  max-width: 100%;
  padding: 0;
  overflow: hidden;
  scroll-padding: 0;
  background: #faf8f1;
  color: #35482e;
}
.app-sheet.memory-studio-dialog[open] {
  display: flex;
  flex-direction: column;
}
.memory-studio-dialog .sheet-handle {
  flex: 0 0 15px;
}
.memory-studio-dialog .memory-studio-header {
  flex: 0 0 auto;
  padding: 7px 20px 13px;
  align-items: center;
  gap: 12px;
  border-bottom: 0;
}
.memory-studio-dialog .memory-studio-header .eyebrow {
  display: block;
  font-size: 9px;
  color: #7b846f;
  letter-spacing: .35px;
}
.memory-studio-dialog .memory-studio-header h2 {
  margin: 5px 0 0;
  font-size: 25px;
  line-height: 1.3;
  letter-spacing: -.9px;
  text-align: left;
}
.memory-studio-dialog .memory-studio-header .icon-button {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  margin: 0 -6px 0 0;
  border: 1px solid #e1e3d8;
  border-radius: 50%;
  background: #f1f0e8;
  color: #77816a;
}
.memory-studio-dialog .studio-preview-area {
  flex: 0 0 auto;
  min-height: 0;
  padding: 0 20px 10px;
}
.memory-studio-dialog .memory-studio-preview-wrap {
  height: var(--studio-preview-height);
  min-height: 0;
  padding: 16px;
  margin: 0;
  border-radius: 17px;
  background: #eae8dc;
  border: 1px solid #e4e2d7;
  align-items: center;
}
.memory-studio-dialog .memory-studio-preview-wrap canvas {
  width: auto;
  height: auto;
  max-height: 100%;
  max-width: 100%;
  border-radius: 2px;
  object-fit: contain;
  box-shadow: 0 5px 14px #35402c1a;
}
.memory-studio-dialog .memory-studio-source {
  color: #77826c;
  font-size: 10px;
  line-height: 1.65;
  margin: 8px 5px 0;
  text-align: center;
}
.memory-studio-dialog .memory-studio-error {
  margin: 8px 0 0;
  padding: 8px 10px;
  font-size: 11px;
}
.memory-studio-dialog .studio-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  flex: 0 0 auto;
  gap: 4px;
  padding: 4px;
  margin: 0 20px;
  border-radius: 13px;
  background: #eeeee5;
}
.memory-studio-dialog .studio-tabs button {
  min-height: 44px;
  padding: 9px 6px;
  border-radius: 10px;
  font-size: 12px;
  color: #818b76;
  transition: background .18s, color .18s, box-shadow .18s;
}
.memory-studio-dialog .studio-tabs button[aria-selected=true] {
  background: #fffdf7;
  color: #4e6841;
  font-weight: 600;
  box-shadow: 0 2px 7px #3e492311;
}
.memory-studio-dialog .studio-panel-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 17px 20px 20px;
  scrollbar-width: none;
  overscroll-behavior: contain;
  scroll-padding-block: 12px 20px;
}
.memory-studio-dialog .studio-panel-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.memory-studio-dialog .studio-panel {
  outline-offset: -2px;
}
.memory-studio-dialog .studio-panel[hidden] {
  display: none;
}
.memory-studio-dialog .studio-panel:focus-visible {
  outline: 2px solid #92a57e;
  outline-offset: 3px;
  border-radius: 5px;
}
.memory-studio-dialog .studio-panel-intro h3 {
  font-family: var(--serif);
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -.5px;
  margin: 0 0 6px;
}
.memory-studio-dialog .studio-panel-intro p,
.memory-studio-dialog .studio-style-description,
.memory-studio-dialog .studio-panel-tip {
  font-size: 10.5px;
  line-height: 1.75;
  color: #7d8772;
  margin: 0 0 14px;
}
.memory-studio-dialog .studio-panel-tip {
  margin: 13px 0 0;
}
.memory-studio-dialog .studio-style-description {
  margin: 12px 0 0;
  color: #637954;
}
.memory-studio-dialog .print-style-options {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.memory-studio-dialog .print-style-options button {
  min-width: 0;
  min-height: 113px;
  padding: 12px 5px 10px;
  text-align: center;
  border: 1px solid #dedfd2;
  border-radius: 13px;
  background: #f6f4ec;
  transition: border-color .18s, background .18s, transform .18s;
}
.memory-studio-dialog .print-style-options button[aria-pressed=true] {
  background: #e7eddd;
  border-color: #91a47b;
  color: #435d36;
}
.memory-studio-dialog .print-style-options button:active {
  transform: scale(.97);
}
.memory-studio-dialog .print-style-options strong {
  font-size: 10.5px;
  line-height: 1.6;
  word-break: keep-all;
}
.memory-studio-dialog .print-style-options small {
  display: none;
}
.memory-studio-dialog .print-style-swatch {
  display: block;
  width: 37px;
  height: 48px;
  margin: 0 auto 9px;
  padding: 0;
  background: #bdc7ae;
  border: 1px solid #9ba78c;
  border-radius: 1px;
  box-shadow: 0 2px 4px #293b1c11;
}
.memory-studio-dialog [data-print-style=paper] .print-style-swatch {
  border: 4px solid #fffcf3;
  outline: 1px solid #dddccf;
}
.memory-studio-dialog [data-print-style=instant] .print-style-swatch {
  border: 4px solid #fffcf3;
  border-bottom-width: 12px;
  outline: 1px solid #dddccf;
}
.memory-studio-dialog [data-print-style=film] .print-style-swatch {
  border: 4px solid #353e31;
  border-bottom-width: 8px;
}
/* Frame options use the real export colors; only this tool area scrolls. */
.memory-studio-dialog .studio-frame-settings {
  margin-top: 16px;
  padding-top: 15px;
  border-top: 1px solid #e2e5d8;
}
.memory-studio-dialog .studio-frame-field {
  min-width: 0;
  padding: 0;
  border: 0;
  margin: 0 0 15px;
}
.memory-studio-dialog .studio-frame-field legend {
  padding: 0;
  margin-bottom: 9px;
  color: #596f4b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
}
.memory-studio-dialog .studio-frame-size-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}
.memory-studio-dialog .studio-paper-options {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}
.memory-studio-dialog .studio-frame-size-options button,
.memory-studio-dialog .studio-paper-options button {
  min-width: 0;
  min-height: 44px;
  padding: 9px 5px;
  border: 1px solid #dedfd2;
  border-radius: 12px;
  background: #f6f4ec;
  color: #79866c;
  font-size: 11px;
  line-height: 1.6;
  transition: border-color .18s, background .18s, color .18s;
}
.memory-studio-dialog .studio-paper-options button {
  display: flex;
  min-height: 68px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 9px 3px 7px;
  font-size: 10px;
}
.memory-studio-dialog .studio-frame-size-options button[aria-pressed=true],
.memory-studio-dialog .studio-paper-options button[aria-pressed=true] {
  border-color: #91a47b;
  background: #e7eddd;
  color: #435d36;
  font-weight: 600;
}
.memory-studio-dialog .studio-paper-swatch {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border: 1px solid #989e8b66;
  border-radius: 50%;
  background: var(--studio-paper-color, var(--studio-auto-paper, #f6f1e5));
  box-shadow: inset 0 0 0 2px #ffffff33;
}
.memory-studio-dialog .studio-frame-option-label { word-break: keep-all; }
.memory-studio-dialog .studio-frame-summary,
.memory-studio-dialog .studio-frame-none-note {
  margin: 0;
  color: #7d8772;
  font-size: 10px;
  line-height: 1.85;
  word-break: keep-all;
}
.memory-studio-dialog .studio-frame-summary { color: #647b53; }
.memory-studio-dialog .studio-frame-none-note { margin-top: 13px; }
.memory-studio-dialog .memory-studio-field {
  margin: 0 0 16px;
}
.memory-studio-dialog .memory-studio-field > label {
  font-size: 12px;
  color: #526547;
  margin-bottom: 8px;
}
.memory-studio-dialog .memory-studio-field input[type=text] {
  min-height: 50px;
  font-size: 16px;
  padding: 12px;
  border-color: #cbd1be;
  border-radius: 12px;
  background: #fffdf8;
}
.memory-studio-dialog .memory-writing-prompts {
  gap: 5px;
  margin-top: 7px;
}
.memory-studio-dialog .memory-writing-prompts button {
  min-height: 44px;
  padding: 7px 10px;
  background: #eeeee4;
  color: #728363;
}
.memory-studio-dialog .memory-studio-field p {
  font-size: 10.5px;
  color: #7c8771;
  line-height: 1.75;
}
.memory-studio-dialog .memory-date-row {
  padding-top: 2px;
  border-top: 1px solid #e4e5db;
}
.memory-studio-dialog .memory-date-row input[type=date] {
  font-size: 16px;
  background: #fffdf8;
  border-color: #d5dacb;
  border-radius: 10px;
}
.memory-studio-dialog .memory-light-controls {
  margin: 0;
  padding: 0;
  border: 0;
}
.memory-studio-dialog .memory-light-controls .memory-studio-field {
  margin: 0 0 10px;
}
.memory-studio-dialog .memory-light-controls input[type=range] {
  width: 100%;
  height: 44px;
  margin: 0;
  accent-color: #71865f;
}
.memory-studio-dialog .memory-light-controls p {
  margin-top: 3px;
}
/* Each piece of text keeps its own settings; the photo stays above the tools. */
.memory-studio-dialog .studio-text-design {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid #e2e5d8;
}
.memory-studio-dialog .studio-text-intro h3 {
  margin: 0 0 6px;
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -.5px;
}
.memory-studio-dialog .studio-text-intro p,
.memory-studio-dialog .studio-text-status {
  margin: 0 0 13px;
  color: #65735b;
  font-size: 11px;
  line-height: 1.8;
  word-break: keep-all;
}
.memory-studio-dialog .studio-text-targets {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border-radius: 13px;
  background: #eceee3;
}
.memory-studio-dialog .studio-text-targets button {
  min-width: 0;
  min-height: 44px;
  padding: 8px;
  border-radius: 10px;
  font-size: 12px;
  color: #65735b;
}
.memory-studio-dialog .studio-text-targets button[aria-pressed=true] {
  color: #435e35;
  background: #fffdf7;
  font-weight: 600;
  box-shadow: 0 2px 7px #3e492311;
}
.memory-studio-dialog .studio-text-switch {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin: 12px 0 7px;
  padding: 11px 12px;
  border: 1px solid #d5dccb;
  border-radius: 12px;
  background: #f0f2e7;
  color: #506743;
  font-size: 12px;
  cursor: pointer;
}
.memory-studio-dialog .studio-text-switch input {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  margin: 0;
  accent-color: #71865f;
}
.memory-studio-dialog .studio-text-controls {
  margin-top: 15px;
}
.memory-studio-dialog .studio-text-appearance {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 100px;
  gap: 12px;
  margin-bottom: 17px;
}
.memory-studio-dialog .studio-text-field label,
.memory-studio-dialog .studio-text-range label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: #526547;
  font-size: 12px;
}
.memory-studio-dialog .studio-text-field select {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 9px 11px;
  border: 1px solid #cbd1be;
  border-radius: 12px;
  background: #fffdf8;
  color: #4e6243;
  font: 16px/1.5 var(--sans);
}
.memory-studio-dialog .studio-text-color-field input[type=color] {
  width: 100%;
  min-height: 46px;
  padding: 5px;
  border: 1px solid #cbd1be;
  border-radius: 12px;
  background: #fffdf8;
  cursor: pointer;
}
.memory-studio-dialog .studio-text-color-field output {
  display: block;
  margin-top: 4px;
  text-align: center;
  font: 9px/1.5 ui-monospace, monospace;
  color: #65735b;
}
.memory-studio-dialog .studio-text-range {
  margin: 0 0 14px;
}
.memory-studio-dialog .studio-text-range input[type=range] {
  width: 100%;
  height: 44px;
  margin: 0;
  accent-color: #71865f;
}
.memory-studio-dialog .studio-text-range output {
  font: 10px/1.5 ui-monospace, monospace;
  color: #65735b;
}
.memory-studio-dialog .studio-text-range p,
.memory-studio-dialog .studio-text-range-captions {
  margin: 2px 0 0;
  color: #65735b;
  font-size: 10px;
  line-height: 1.7;
}
.memory-studio-dialog .studio-text-range-captions {
  display: flex;
  justify-content: space-between;
}
.memory-studio-dialog .studio-text-colors {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 17px 0 8px;
}
.memory-studio-dialog .studio-text-colors button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 44px;
  padding: 8px 4px;
  border: 1px solid #dce0d2;
  border-radius: 11px;
  background: #f6f4ec;
  color: #65735b;
  font-size: 11px;
}
.memory-studio-dialog .studio-text-colors button>span {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  border: 1px solid #929b8366;
  border-radius: 50%;
  background: var(--text-swatch);
}
.memory-studio-dialog .studio-text-colors button[aria-pressed=true] {
  border-color: #91a47b;
  background: #e7eddd;
  color: #435d36;
}
.memory-studio-dialog .studio-text-reset {
  width: 100%;
  min-height: 44px;
  padding: 9px 4px;
  color: #65735b;
  font-size: 11px;
}
.memory-studio-dialog .studio-text-drag-hint {
  margin: 6px 4px 0;
  color: #65735b;
  font-size: 10px;
  line-height: 1.6;
  text-align: center;
  word-break: keep-all;
}
.memory-studio-dialog #memory-studio-preview.is-text-editing {
  touch-action: none;
  cursor: crosshair;
  outline: 1px dashed #91a47b;
  outline-offset: 3px;
}
.memory-studio-dialog #memory-studio-preview.is-text-editing:focus-visible {
  outline: 2px solid #71865f;
  outline-offset: 3px;
}
.memory-studio-dialog .memory-studio-actions {
  position: relative;
  bottom: auto;
  margin: 0;
  flex: 0 0 auto;
  padding: 12px 20px max(14px, env(safe-area-inset-bottom));
  gap: 10px;
  background: #faf8f1;
  border-top: 1px solid #e2e5d8;
  box-shadow: none;
}
.memory-studio-dialog .memory-studio-actions .text-button {
  flex: 0 0 64px;
  color: #7b8870;
  font-size: 12px;
}
.memory-studio-dialog .memory-studio-actions .primary-button {
  flex: 1 1 auto;
  border-radius: 14px;
  min-height: 49px;
  font-size: 13px;
  background: #5a7050;
  color: #fffdf4;
  box-shadow: 0 3px 8px #3e50231a;
}
@media (max-width: 759px) {
  .app-sheet.memory-studio-dialog {
    margin: 0 auto;
    inset: auto 0 var(--studio-keyboard-inset, 0px);
    border-radius: 26px 26px 0 0;
  }
}
@media (max-height: 720px) {
  .app-sheet.memory-studio-dialog {
    --studio-preview-height: clamp(120px, 24dvh, 172px);
  }
  .memory-studio-dialog .memory-studio-header {
    padding-top: 2px;
    padding-bottom: 9px;
  }
  .memory-studio-dialog .memory-studio-header h2 { font-size: 22px; }
  .memory-studio-dialog .studio-preview-area { padding-bottom: 8px; }
  .memory-studio-dialog .memory-studio-preview-wrap { padding: 10px; }
  .memory-studio-dialog .studio-panel-scroll { padding-top: 13px; }
}
@media (max-height: 520px) {
  .app-sheet.memory-studio-dialog { --studio-preview-height: 80px; }
  .memory-studio-dialog .memory-studio-header .eyebrow { display: none; }
  .memory-studio-dialog .memory-studio-header { padding-top: 0; padding-bottom: 5px; }
  .memory-studio-dialog .studio-preview-area { padding-bottom: 4px; }
  .memory-studio-dialog .memory-studio-source { font-size: 9px; margin-top: 5px; }
  .memory-studio-dialog .studio-tabs { margin-inline: 16px; }
  .memory-studio-dialog .studio-panel-scroll { min-height: 0; padding: 10px 16px 14px; }
  .memory-studio-dialog .memory-studio-actions { padding-top: 8px; padding-bottom: max(8px, env(safe-area-inset-bottom)); }
}
@media (min-width: 760px) {
  .app-sheet.memory-studio-dialog {
    height: min(860px, calc(100dvh - 48px));
    max-width: min(480px, calc(100vw - 48px));
    max-height: calc(100dvh - 48px);
    border-radius: 26px;
    margin: auto;
  }
  .memory-studio-dialog .memory-studio-header { padding-inline: 26px; }
  .memory-studio-dialog .studio-preview-area { padding-inline: 26px; }
  .memory-studio-dialog .studio-tabs { margin-inline: 26px; }
  .memory-studio-dialog .studio-panel-scroll { padding-inline: 26px; }
  .memory-studio-dialog .memory-studio-actions { padding-inline: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .memory-studio-dialog *, .memory-studio-dialog *::before, .memory-studio-dialog *::after {
    transition: none;
    animation: none;
  }
}
@media (forced-colors: active) {
  .memory-studio-dialog .studio-panel-scroll { scrollbar-width: auto; }
  .memory-studio-dialog .studio-panel-scroll::-webkit-scrollbar { display: revert; width: revert; height: revert; }
  .memory-studio-dialog .studio-tabs button[aria-selected=true],
  .memory-studio-dialog .print-style-options button[aria-pressed=true],
  .memory-studio-dialog .studio-frame-size-options button[aria-pressed=true],
  .memory-studio-dialog .studio-paper-options button[aria-pressed=true],
  .memory-studio-dialog .studio-text-targets button[aria-pressed=true],
  .memory-studio-dialog .studio-text-colors button[aria-pressed=true] { outline: 2px solid Highlight; outline-offset: -3px; }
  .memory-studio-dialog .studio-paper-swatch { forced-color-adjust: none; }
  .memory-studio-dialog .studio-text-colors button>span { forced-color-adjust: none; }
}
/* visualViewport can shrink before the layout viewport when a keyboard opens. */
.memory-studio-dialog.studio-compact .memory-studio-header { padding-top: 2px; padding-bottom: 9px; }
.memory-studio-dialog.studio-compact .memory-studio-header h2 { font-size: 22px; }
.memory-studio-dialog.studio-compact .studio-preview-area { padding-bottom: 8px; }
.memory-studio-dialog.studio-compact .memory-studio-preview-wrap { padding: 10px; }
.memory-studio-dialog.studio-short .memory-studio-header .eyebrow { display: none; }
.memory-studio-dialog.studio-short .memory-studio-header { padding-top: 0; padding-bottom: 5px; }
.memory-studio-dialog.studio-short .studio-preview-area { padding-bottom: 4px; }
.memory-studio-dialog.studio-short .memory-studio-source { font-size: 9px; margin-top: 5px; }
.memory-studio-dialog.studio-short .studio-panel-scroll { padding-top: 10px; padding-bottom: 14px; }
.memory-studio-dialog.studio-short .memory-studio-actions { padding-top: 8px; padding-bottom: max(8px, env(safe-area-inset-bottom)); }

/* The zoomed view is a viewing transform; the print recipe stays unchanged. */
.memory-studio-dialog .studio-preview-area { position:relative; }
.memory-studio-dialog .studio-preview-heading { position:absolute; top:8px; right:28px; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.memory-studio-dialog .studio-preview-heading>span { display:none; font-size:12px; color:#65735b; }
.memory-studio-dialog .studio-preview-heading button { min-height:44px; padding:8px 13px; border:1px solid #d7ddcb; border-radius:13px; background:#fffdf5ed; color:#506743; font-size:11px; box-shadow:0 2px 8px #35402c13; }
.memory-studio-dialog #memory-preview-viewport { position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:12px; touch-action:none; cursor:grab; }
.memory-studio-dialog #memory-preview-viewport.is-gesturing { cursor:grabbing; }
.memory-studio-dialog #memory-preview-viewport:focus-visible { outline:2px solid #71865f; outline-offset:2px; }
.memory-studio-dialog #memory-preview-transform { display:flex; align-items:center; justify-content:center; width:100%; height:100%; min-width:0; min-height:0; transform-origin:center; will-change:transform; }
.memory-studio-dialog #memory-preview-transform canvas { display:block; flex:0 0 auto; width:auto; height:auto; max-width:100%; max-height:100%; }
.memory-studio-dialog .studio-zoom-controls { display:flex; align-items:center; justify-content:center; gap:6px; min-height:44px; margin-top:6px; }
.memory-studio-dialog .studio-zoom-controls button { flex:0 0 44px; min-width:44px; min-height:44px; padding:7px; border:1px solid #dce0d2; border-radius:12px; background:#f2f2e8; color:#5d7350; font-size:19px; line-height:1; }
.memory-studio-dialog .studio-zoom-controls button:disabled { opacity:.35; }
.memory-studio-dialog .studio-zoom-controls #memory-zoom-reset { flex-basis:80px; font-size:11px; }
.memory-studio-dialog #memory-zoom-value { min-width:52px; text-align:center; color:#65735b; font:11px/1.5 ui-monospace,monospace; }
.memory-studio-dialog .memory-studio-source { margin-top:4px; }
.memory-studio-dialog .studio-text-drag-hint { margin-top:4px; font-size:9px; line-height:1.5; }
.memory-studio-dialog .studio-preview-quick-tools { display:grid; grid-template-columns:1fr 1fr 1.5fr; gap:5px; flex:0 0 auto; }
.memory-studio-dialog .studio-preview-quick-tools button { min-width:0; min-height:44px; padding:8px 5px; border:1px solid #d7decc; border-radius:12px; background:#f2f2e8; color:#65735b; font-size:11px; }
.memory-studio-dialog .studio-preview-quick-tools button[aria-pressed=true] { background:#e4ebd8; border-color:#9db28a; color:#435f35; }
.memory-studio-dialog .studio-preview-quick-tools button:disabled { opacity:.5; }
.memory-studio-dialog.is-preview-expanded .studio-tabs,
.memory-studio-dialog.is-preview-expanded .studio-panel-scroll { display:none; }
.memory-studio-dialog.is-preview-expanded .studio-preview-area { display:flex; flex-direction:column; gap:8px; flex:1 1 0; min-height:0; padding:0 16px 10px; }
.memory-studio-dialog.is-preview-expanded .studio-preview-heading { position:static; flex:0 0 44px; }
.memory-studio-dialog.is-preview-expanded .studio-preview-heading>span { display:block; }
.memory-studio-dialog.is-preview-expanded #memory-preview-viewport { flex:1 1 0; height:auto; min-height:0; }
.memory-studio-dialog.is-preview-expanded .studio-zoom-controls { flex:0 0 44px; margin-top:0; }
.memory-studio-dialog.is-preview-expanded .memory-studio-source,
.memory-studio-dialog.is-preview-expanded .studio-text-drag-hint { display:none; }
.memory-studio-dialog .studio-artwork-controls { margin-bottom:17px; padding-bottom:16px; border-bottom:1px solid #e2e5d8; }
.memory-studio-dialog .studio-artwork-options { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-bottom:13px; }
.memory-studio-dialog .studio-artwork-options button { min-height:48px; padding:10px 8px; border:1px solid #dedfd2; border-radius:13px; background:#f6f4ec; color:#65735b; font-size:12px; }
.memory-studio-dialog .studio-artwork-options button[aria-pressed=true] { border-color:#91a47b; background:#e7eddd; color:#435d36; font-weight:600; }
.memory-studio-dialog #memory-watercolor-strength { width:100%; height:44px; margin:0; accent-color:#71865f; }
@media(max-width:359px) {
  .memory-studio-dialog .studio-preview-area { padding-inline:16px; }
  .memory-studio-dialog .studio-preview-heading { right:24px; }
  .memory-studio-dialog .studio-zoom-controls { gap:4px; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-area { padding-inline:12px; }
  .memory-studio-dialog .studio-preview-quick-tools button { font-size:10px; }
}
@media(max-height:560px) and (orientation:landscape) {
  .app-sheet.memory-studio-dialog.is-preview-expanded { width:min(900px,100%); max-width:100%; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-area { display:grid; grid-template-columns:minmax(0,1fr) 210px; grid-template-rows:44px minmax(0,1fr) 44px; gap:7px 12px; padding:0 14px 8px; }
  .memory-studio-dialog.is-preview-expanded #memory-preview-viewport { grid-column:1; grid-row:1/4; height:100%; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-heading { grid-column:2; grid-row:1; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-heading>span { display:none; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-heading button { width:100%; }
  .memory-studio-dialog.is-preview-expanded .studio-preview-quick-tools { grid-column:2; grid-row:2; grid-template-columns:1fr 1fr; align-content:center; }
  .memory-studio-dialog.is-preview-expanded #memory-preview-text-toggle { grid-column:1/-1; }
  .memory-studio-dialog.is-preview-expanded .studio-zoom-controls { grid-column:2; grid-row:3; gap:4px; }
  .memory-studio-dialog.is-preview-expanded #memory-zoom-reset { flex-basis:66px; }
  .memory-studio-dialog.is-preview-expanded #memory-zoom-value { min-width:42px; font-size:10px; }
}
@media(forced-colors:active) {
  .memory-studio-dialog .studio-preview-quick-tools button[aria-pressed=true],
  .memory-studio-dialog .studio-artwork-options button[aria-pressed=true] { outline:2px solid Highlight; outline-offset:-3px; }
}

/* Every drawing card previews the same local photograph, never a canned painting. */
.memory-studio-dialog .studio-artwork-intro { margin-bottom: 9px; }
.memory-studio-dialog .studio-artwork-source { margin: 0 0 12px; font-size: 10px; line-height: 1.65; color: #758269; }
.memory-studio-dialog .studio-artwork-options { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-bottom: 12px; }
.memory-studio-dialog .studio-artwork-options .studio-artwork-card { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 0; min-width: 0; min-height: 44px; padding: 5px 5px 8px; border-radius: 13px; text-align: center; overflow: hidden; }
.memory-studio-dialog .studio-artwork-thumbnail { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 4/3; min-height: 0; background: #e9e7dc; border-radius: 8px; overflow: hidden; margin-bottom: 7px; }
.memory-studio-dialog .studio-artwork-thumbnail canvas { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; opacity: 1; transition: opacity .15s; }
.memory-studio-dialog .studio-artwork-thumbnail canvas[data-ready=false] { opacity: .28; }
.memory-studio-dialog .studio-artwork-thumbnail canvas[data-error=true] { visibility: hidden; }
.memory-studio-dialog .studio-artwork-card strong { display: block; font-size: 11px; line-height: 1.5; font-weight: 500; }
.memory-studio-dialog .studio-artwork-card small { display: block; min-height: 14px; margin-top: 2px; color: #7a856e; font-size: 9px; line-height: 1.5; }
.memory-studio-dialog .studio-artwork-card[aria-pressed=true] { background: #e7eddd; border-color: #8ea47a; box-shadow: inset 0 0 0 1px #8ea47a; }
.memory-studio-dialog .studio-artwork-card[aria-pressed=true] strong { color: #3e5932; font-weight: 600; }
.memory-studio-dialog .studio-artwork-check { display: none; position: absolute; top: 9px; right: 9px; width: 18px; height: 18px; border-radius: 50%; color: #fffdf7; background: #607a4d; font: 11px/18px var(--sans); text-align: center; box-shadow: 0 1px 5px #26392222; }
.memory-studio-dialog .studio-artwork-card[aria-pressed=true] .studio-artwork-check { display: block; }
.memory-studio-dialog .studio-artwork-selection { display: flex; align-items: center; gap: 10px; padding: 10px 0 2px; }
.memory-studio-dialog #memory-artwork-description { flex: 1; min-width: 0; margin: 0; color: #5d7050; font-size: 11px; line-height: 1.75; }
.memory-studio-dialog #memory-artwork-compare { flex: 0 0 94px; min-height: 44px; padding: 7px 9px; border: 1px solid #cbd5be; border-radius: 11px; background: #f4f4e9; color: #586f47; font-size: 10px; line-height: 1.5; }
.memory-studio-dialog #memory-artwork-compare[aria-pressed=true] { background: #e4ebd8; border-color: #91a47b; color: #435d36; }
.memory-studio-dialog #memory-artwork-compare:disabled { opacity: .45; }
.memory-studio-dialog .studio-artwork-controls #memory-watercolor-controls { margin-top: 13px; margin-bottom: 7px; }
@media(max-width:359px) {
  .memory-studio-dialog .studio-artwork-options { gap: 6px; }
  .memory-studio-dialog .studio-artwork-options .studio-artwork-card { padding: 4px 4px 7px; border-radius: 11px; }
  .memory-studio-dialog .studio-artwork-card strong { font-size: 10px; }
  .memory-studio-dialog .studio-artwork-card small { font-size: 8px; }
  .memory-studio-dialog .studio-artwork-selection { gap: 7px; }
  .memory-studio-dialog #memory-artwork-description { font-size: 10px; }
  .memory-studio-dialog #memory-artwork-compare { flex-basis: 88px; }
}
@media(prefers-reduced-motion:reduce) {
  .memory-studio-dialog .studio-artwork-thumbnail canvas { transition: none; }
}
@media(forced-colors:active) {
  .memory-studio-dialog .studio-artwork-card[aria-pressed=true],
  .memory-studio-dialog #memory-artwork-compare[aria-pressed=true] { outline: 2px solid Highlight; outline-offset: -3px; }
}
.memory-studio-dialog .studio-artwork-compare-status { position: absolute; left: 14px; bottom: 12px; z-index: 2; max-width: calc(100% - 28px); padding: 7px 10px; border: 1px solid #dddcca; border-radius: 9px; background: #fffdf3eb; color: #586b4b; font-size: 10px; line-height: 1.5; pointer-events: none; box-shadow: 0 2px 7px #26392215; }
.memory-studio-dialog .studio-artwork-compare-status[hidden] { display: none; }
/* Keep the large photograph while giving its drawing choices room to breathe. */
.memory-studio-dialog[data-studio-tab=light]:not(.is-preview-expanded) .studio-zoom-controls,
.memory-studio-dialog[data-studio-tab=light]:not(.is-preview-expanded) .memory-studio-source { display: none; }