.data-storage-page { height: auto; min-height: 100dvh; overflow: auto; }
.data-storage-page .subpage-header { position: static; }
.data-storage-page .help-note { font-size: 13px; color: var(--text-sub); }
.data-storage-main { width: min(100%, 880px); margin: 0 auto; padding: 32px 24px 48px; }
.data-storage-main h1 { font-size: clamp(23px, 4vw, 30px); line-height: 1.5; margin: 6px 0 14px; }
.data-storage-main h2 { font-size: 17px; margin: 0 0 12px; }
.data-storage-main p { line-height: 1.8; margin: 10px 0; }
.data-storage-kicker { color: var(--text-sub); font-size: 12px; }
.data-storage-intro { font-size: 15px; }
.data-storage-section { margin: 20px 0; padding: 22px; }
.data-storage-section > p { font-size: 13px; color: var(--text-sub); }
#v2-production-guide { margin: 16px 0; font-size: 13px; line-height: 1.8; }
#v2-production-guide summary { cursor: pointer; font-weight: 600; }
#v2-production-guide ol { padding-left: 22px; margin: 12px 0; }
#v2-production-guide li + li { margin-top: 6px; }
.data-storage-actions, .data-storage-section-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.data-storage-section-heading { justify-content: space-between; }
.data-file-label { position: relative; overflow: hidden; }
.data-file-label input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.data-file-label:focus-within { outline: 2px solid var(--accent-dark); outline-offset: 3px; }
.data-storage-list li { border-top: 1px solid var(--border); padding: 12px 0; }
.data-storage-list button { width: 100%; min-height: 40px; padding: 10px 12px; white-space: normal; height: auto; justify-content: flex-start; text-align: left; overflow-wrap: anywhere; }
.data-storage-list .project-row-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.data-storage-list .project-row-actions button { width: auto; min-height: 36px; }
.project-dialog { width: min(660px, calc(100vw - 32px)); max-height: 90dvh; margin: auto; border: 1px solid var(--border); border-radius: var(--radius-lg); color: var(--text); background: var(--bg-card); padding: 0; }
.project-dialog::backdrop { background: rgba(30, 24, 18, .45); }
.project-dialog { overflow: hidden; }
.project-dialog form { display: flex; flex-direction: column; max-height: calc(90dvh - 2px); }
.project-dialog-header, .project-dialog-footer { flex-shrink: 0; }
.project-dialog .project-dialog-content { overflow: auto; min-height: 0; }
.project-dialog-header, .project-dialog-footer { padding: 16px 20px; display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border); }
.project-dialog-header h2 { font-size: 18px; }
.project-dialog-content { padding: 16px 20px; }
.project-dialog-content p { line-height: 1.8; margin-bottom: 14px; }
.project-field { display: grid; gap: 6px; margin-bottom: 14px; font-size: 13px; font-weight: 600; }
.project-field textarea { height: auto; min-height: 90px; resize: vertical; }
#project-dialog-error { color: var(--danger); padding: 0 20px; }
.project-dialog-footer { justify-content: flex-end; border-top: 1px solid var(--border); border-bottom: 0; }
.data-storage-status { padding: 12px 16px; border-left: 3px solid var(--accent); background: var(--accent-xlight); font-size: 14px; }
.data-storage-status[data-error="true"] { border-color: var(--danger); color: var(--danger); }
#storage-current { overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .data-storage-main { padding: 20px 14px 32px; }
  .data-storage-section { padding: 16px; }
  .data-storage-actions { align-items: stretch; flex-direction: column; }
  .data-storage-actions .btn { justify-content: center; }
}

.photo-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.photo-fields .project-field { min-width: 0; }
.photo-fields select { width: 100%; }
.photo-assets { display: flex; gap: 8px; overflow-x: auto; margin: 16px 0; }
.photo-assets img { flex: 0 0 72px; width: 72px; height: 72px; object-fit: contain; }
.photo-preview { width: 100%; max-width: 595px; overflow: hidden; margin: 16px auto; }
.photo-preview-scale { width: 595px; margin: 0 auto; overflow: hidden; background: white; }
.workspace-controls { min-width: 0; }
.workspace-preview { min-width: 0; padding: 20px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.workspace-preview[hidden] { display: none; }
.preview-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.preview-toolbar label { flex: 1; min-width: 0; margin: 0; }
.preview-toolbar select { width: 100%; }
.workspace-preview .preview-note { min-height: 3em; font-size: 12px; color: var(--text-sub); }
@media (min-width: 1000px) {
  .data-storage-main.has-project { width: min(100%, 1440px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 1fr); gap: 32px; align-items: start; }
  .workspace-preview { position: sticky; top: 20px; max-height: calc(100dvh - 120px); overflow: auto; }
}
.project-dialog-with-preview { width: min(1200px, calc(100vw - 32px)); }
.project-dialog-with-preview form { display: grid; height: min(90dvh, 940px); grid-template-columns: minmax(300px, 1fr) minmax(340px, 1fr); grid-template-rows: auto minmax(0, 1fr) auto auto; }
.project-dialog-with-preview .project-dialog-header { grid-column: 1 / -1; grid-row: 1; }
.project-dialog-with-preview .project-dialog-content { grid-column: 1; grid-row: 2; }
.dialog-paper-preview { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; padding: 20px; border-left: 1px solid var(--border); background: var(--bg); overflow: auto; }
.dialog-paper-preview h3 { font-size: 15px; margin: 0 0 8px; }
.dialog-paper-preview p { font-size: 12px; line-height: 1.6; color: var(--text-sub); }
.project-dialog-with-preview #project-dialog-error { grid-column: 1 / -1; grid-row: 3; }
.project-dialog-with-preview .project-dialog-footer { grid-column: 1 / -1; grid-row: 4; }
@media (max-width: 999px) {
  .data-storage-main.has-project { display: flex; flex-direction: column; gap: 20px; }
  .workspace-preview { width: 100%; order: -1; }
}
@media (max-width: 700px) {
  .project-dialog-with-preview form { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(100px, 1fr) minmax(140px, 32dvh) auto auto; }
  .dialog-paper-preview { grid-column: 1; grid-row: 3; border-left: 0; border-top: 1px solid var(--border); padding: 10px 16px; }
  .dialog-paper-preview .photo-preview { margin: 6px auto; }
  .project-dialog-with-preview #project-dialog-error { grid-row: 4; }
  .project-dialog-with-preview .project-dialog-footer { grid-row: 5; }
  .project-dialog-with-preview .project-dialog-header { padding: 12px; }
  .project-dialog-with-preview .project-dialog-header h2 { font-size: 16px; }
}
@media (max-width: 480px) { .photo-fields { grid-template-columns: 1fr; } }
.photo-assets figure { margin: 0; flex: 0 0 72px; text-align: center; font-size: 12px; }
.storage-capacity { border-top: 1px solid #ddd2c4; margin-top: 20px; padding-top: 16px; }
.storage-capacity h3, .storage-problem h3 { font-size: 15px; margin: 0 0 8px; }
.storage-problem { border-left: 3px solid #a35e35; background: #faf3e9; padding: 16px; margin-top: 16px; }
.storage-problem[hidden], .storage-problem [hidden] { display: none; }
.v2-export [hidden] { display: none; }
.preflight [hidden] { display: none; }
#preflight-results { padding-left: 20px; }
#preflight-results li { margin: 16px 0; overflow-wrap: anywhere; }
