/* Keep editor chrome clear of the project launcher. */
.project-bar {
  position: fixed;
  z-index: 25;
  top: calc(var(--px-header-height, var(--creation-editor-header, 64px)) + 8px);
  left: 12px;
  height: 46px;
  pointer-events: none;
}
.project-bar button {
  box-sizing: border-box;
  width: 46px;
  height: 46px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid #647987;
  border-radius: 14px;
  background: linear-gradient(145deg, #2d3d49, #17232d);
  color: #f4f0e4;
  box-shadow: 0 5px 16px #0005, inset 0 1px #ffffff12;
  pointer-events: auto;
  touch-action: manipulation;
}
.project-bar svg { width: 23px; height: 23px; color: #ffe08a; }
.project-bar__state { position: absolute; right: 3px; bottom: 3px; width: 8px; height: 8px; border: 2px solid #1c2933; border-radius: 50%; background: #ffc962; }
[data-state=saved] .project-bar__state { background: #8ecba0; }
[data-state=error] .project-bar__state { background: #ff8b7a; }
[data-state=saving] .project-bar__state { animation: project-save 1s steps(2) infinite; }
@keyframes project-save { 50% { opacity: .4; } }
.project-bar__name { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
/* Moving the existing launcher into the header removes its reserved editor row. */
body.px-tool-header.project-workspace-ready .project-bar.px-tool-header-files { position: relative; top: auto; left: auto; flex: 0 0 44px; width: 44px; height: 44px; }
body.px-tool-header .project-bar.px-tool-header-files button { width: 44px; height: 44px; border-radius: 10px; box-shadow: inset 0 1px #ffffff12; }
body.project-workspace-ready.creation-editor #main { padding-top: calc(var(--px-header-height, 64px) - 2px) !important; }
body.project-workspace-ready.app-page--tool-jigsaw #main { padding-top: calc(var(--px-header-height, 64px) - 2px); }
body.project-workspace-ready:is(.hidden-object-editing, .spot-editing) .project-bar { top: calc(var(--px-header-height, 64px) + 8px); }
body.project-workspace-ready:is(.hidden-object-editing, .spot-editing) :is(.hidden-preview, .spot-preview) { top: 0; }
body.project-workspace-ready :is(.hidden-settings summary, .spot-settings summary, .hidden-target-list button) { min-height: 44px; }
body.project-workspace-ready:is(.hidden-object-editing, .spot-editing) :is(.hidden-source-label, .spot-source-label) { display: none; }
body.project-workspace-ready.hidden-object-editing .hidden-settings { top: 8px; right: 12px; left: auto; }
body.project-workspace-ready.hidden-object-editing .hidden-settings summary { margin-left: auto; }
body.project-workspace-ready.hidden-object-editing .hidden-edit-hint { top: 62px; }
body.project-workspace-ready.spot-editing .spot-settings { top: 8px; right: 12px; }
body.project-workspace-ready:not(.hidden-object-editing).app-page--tool-hidden-object #main,
body.project-workspace-ready:not(.spot-editing).app-page--tool-spot-difference #main { padding-top: calc(var(--px-header-height, 64px) - 2px); }
body[data-tool-result-open] .project-bar { display: none; }
body.project-workspace-ready.creation-editor[data-tool-result-open] #main { padding-top: 8px !important; }
body.project-workspace-ready .draw-meta { display: none; }
body.project-workspace-ready .audio-status.is-visible { top: calc(var(--creation-editor-header, 64px) + 60px); }
body.project-workspace-ready[data-tool-name="ドット絵カメラ"] .lc-top.px-site-header .lc-zoom-stops { top: calc(100% + 60px); }
body.px-tool-header.project-workspace-ready.creation-editor #main { padding-top: 8px !important; }
body.px-tool-header.project-workspace-ready.app-page--tool-jigsaw #main,
body.px-tool-header.project-workspace-ready:not(.hidden-object-editing).app-page--tool-hidden-object #main,
body.px-tool-header.project-workspace-ready:not(.spot-editing).app-page--tool-spot-difference #main { padding-top: 8px; }
body.px-tool-header.project-workspace-ready .audio-status.is-visible { top: calc(var(--creation-editor-header,56px) + 8px); }
body.px-tool-header.project-workspace-ready[data-tool-name="ドット絵カメラ"] .lc-top.px-site-header .lc-zoom-stops { top: calc(100% + 4px); }
body.px-tool-header.project-workspace-ready.creation-editor .px-site-header .creation-output__panel { top: calc(var(--creation-editor-header) + 8px); max-height: calc(100dvh - var(--creation-editor-header) - var(--creation-editor-bottom) - 20px); }
body.px-tool-header.project-workspace-ready.creation-editor .px-site-header .creation-output[open] > summary { position: relative; top: auto; right: auto; z-index: auto; }
body.px-tool-header.project-workspace-ready.creation-editor .px-site-header .creation-output[open] > summary svg { display: block; }
body.px-tool-header.project-workspace-ready.creation-editor .px-site-header .creation-output[open] > summary::after { content: none; }
body.project-workspace-ready #draw-palette { display: flex !important; justify-content: flex-start !important; flex-wrap: nowrap !important; gap: 6px !important; }
body.project-workspace-ready #draw-palette .draw-color { flex: none !important; }
@media (min-width: 900px), (orientation: landscape) and (min-width: 560px) {
  body.project-workspace-ready #draw-palette { flex-wrap: wrap !important; max-height: 210px !important; overflow-y: auto !important; }
}
@media (max-height: 500px) and (orientation: landscape) {
  body.project-workspace-ready #draw-palette { flex-wrap: nowrap !important; max-height: 58px !important; overflow-x: auto !important; overflow-y: hidden !important; }
}
.project-sheet {
  box-sizing: border-box;
  width: min(760px, calc(100vw - 16px));
  max-width: 760px;
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px);
  margin: auto;
  padding: 0 14px 16px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid #526979;
  border-radius: 18px;
  background: linear-gradient(155deg, #22313b, #141f28 78%);
  color: #f4f0e4;
  box-shadow: 0 24px 70px #0008;
  scrollbar-width: thin;
  scrollbar-color: #52606a transparent;
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", system-ui, sans-serif;
}
.project-sheet::backdrop { background: #080e16bb; }
.project-sheet__header {
  position: sticky;
  top: 0;
  z-index: 3;
  display: grid;
  gap: 8px;
  padding: 12px 0 10px;
  border-bottom: 1px solid #415560;
  background: #202f39;
}
.project-sheet__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.project-sheet__heading h2 { margin: 0; color: #fff1bd; font-size: 19px; letter-spacing: .02em; }
.project-sheet button, .project-sheet summary {
  box-sizing: border-box;
  min-width: 44px;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #526979;
  border-radius: 11px;
  background: #182630;
  color: inherit;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  touch-action: manipulation;
}
.project-sheet button:disabled { opacity: .52; cursor: wait; }
.project-sheet__heading button { display: grid; place-items: center; flex: none; padding: 8px; }
.project-sheet svg { width: 21px; height: 21px; flex: none; }
.project-sheet__toolbar { display: flex; align-items: center; gap: 8px; min-width: 0; }
.project-tabs { display: flex; flex: 1; min-width: 0; gap: 4px; padding: 3px; border: 1px solid #3b505d; border-radius: 13px; background: #111c25; }
.project-sheet .project-tabs button { flex: 1 1 0; min-width: 0; padding: 7px 5px; border-color: transparent; background: transparent; color: #c2cdd1; font-size: 12px; font-weight: 650; white-space: nowrap; }
.project-sheet .project-tabs button[aria-selected=true] { border-color: #887544; background: #344550; color: #fff0bf; box-shadow: inset 0 0 0 1px #ffe08a33; }
.project-sheet__toolbar #project-new { flex: none; padding-inline: 12px; border-color: #f2d27a; background: linear-gradient(145deg, #ffe28b, #f1c657); color: #202a33; font-weight: 750; white-space: nowrap; }
.project-sheet :is(input, button, summary):focus-visible { outline: 3px solid #ffe07d; outline-offset: 2px; }
.project-sheet__status { margin: 8px 0 0; color: #ffbeaa; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.project-sheet__status:empty { display: none; }
.project-pane[hidden], .project-list__row[hidden], .project-list__empty[hidden] { display: none; }
.project-pane { min-width: 0; padding-top: 12px; }
.project-pane[aria-labelledby="project-tab-library"][data-empty=true] { padding-top: 6px; }
.project-sheet .project-search { box-sizing: border-box; width: 100%; min-width: 0; min-height: 46px; padding: 9px 12px; border: 1px solid #526979; border-radius: 12px; background: #101d27; color: #f4f0e4; font: inherit; font-size: 16px; }
.project-search::placeholder { color: #9aaeb9; }
.project-library-count { margin: 7px 2px 0; color: #bcc9ce; font-size: 11px; }
.project-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; margin: 10px 0 12px; }
.project-list__empty { grid-column: 1 / -1; margin: 4px 0; color: #f4e2a2; font-size: 14px; line-height: 1.5; }
.project-list__row { display: flex; align-items: stretch; gap: 4px; min-width: 0; }
.project-sheet .project-list__row .project-card { flex: 1; min-width: 0; padding: 8px; }
.project-sheet .project-card {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-width: 0;
  min-height: 100px;
  padding: 9px;
  text-align: left;
  border-color: #465d6a;
  border-radius: 14px;
  background: linear-gradient(145deg, #30414c, #1b2b35);
  transition: background-color 140ms, transform 140ms, border-color 140ms;
}
.project-sheet .project-card[aria-current=true] { border-color: #e4c66e; box-shadow: inset 0 0 0 1px #e4c66e77; }
.project-sheet .project-card:hover { background: #344b58; }
.project-sheet .project-card:active { transform: scale(.985); }
.project-card canvas { box-sizing: border-box; flex: none; width: 76px; height: 76px; object-fit: contain; image-rendering: pixelated; border: 1px solid #607687; border-radius: 8px; background: repeating-conic-gradient(#34414b 0 25%, #29353e 0 50%) 0 0 / 12px 12px; }
.project-card__info { display: grid; gap: 4px; min-width: 0; color: #b9c6ca; font-size: 11px; line-height: 1.35; }
.project-card__info strong { overflow: hidden; color: #f4f0e4; font-size: 13px; font-weight: 700; text-overflow: ellipsis; overflow-wrap: anywhere; }
.project-card__info time { color: #aab9bf; font-size: 10px; }
.project-sheet .project-card__delete { align-self: center; flex: none; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 9px; border-color: transparent; background: transparent; color: #e4aaa0; }
.project-sheet .project-card__delete:hover { border-color: #855a51; background: #ef6e6120; color: #ffb2a3; }
.project-trash, .project-more, .project-imports { margin-top: 8px; border-top: 1px solid #425762; }
.project-sheet :is(.project-trash, .project-more, .project-imports) > summary { display: flex; align-items: center; padding: 0 2px; border: 0; border-radius: 0; background: transparent; color: #e1cf92; font-size: 12px; font-weight: 650; list-style-position: inside; }
.project-sheet :is(.project-trash, .project-more, .project-imports) > summary::-webkit-details-marker { color: #d6bc68; }
.project-sheet :is(.project-trash, .project-more, .project-imports) > summary::after { content: ''; width: 7px; height: 7px; margin-left: auto; margin-right: 6px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.project-sheet :is(.project-trash, .project-more, .project-imports)[open] > summary::after { transform: rotate(225deg); }
.project-sheet__actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
.project-sheet .project-more #pxd-save { border-color: #e2c56e; background: #e2c56e; color: #1c2931; font-weight: 750; }
.project-sheet .project-more #project-duplicate { background: #293b46; }
.project-sheet__current { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 8px; min-width: 0; margin: 0 0 12px; padding: 10px; border: 1px solid #465d6a; border-radius: 14px; background: #172630; }
.project-sheet__current label { grid-column: 1 / -1; color: #d3ddde; font-size: 12px; font-weight: 650; }
.project-sheet__current input { box-sizing: border-box; min-width: 0; width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid #526979; border-radius: 10px; background: #101d27; color: #f4f0e4; font: inherit; font-size: 16px; }
/* The site-wide input surface is forced light; this dark dialog owns its fields. */
#pxd-panel.project-sheet :is(#project-title, #project-search) { background: #101d27 !important; color: #f4f0e4; border: 1px solid #526979 !important; }
.project-sheet__current button { white-space: nowrap; }
.project-sheet__identity { display: flex; align-items: center; gap: 8px; min-width: 0; margin-bottom: 8px; padding: 7px 9px; border-left: 3px solid #dfc36e; border-radius: 7px; background: #101d27; }
.project-sheet__identity > svg { color: #e4cc7e; }
.project-sheet__identity > span { display: grid; gap: 2px; min-width: 0; }
.project-sheet__identity strong { overflow: hidden; color: #f5f2e8; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.project-sheet__identity small { color: #c3cfd0; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.project-sheet__identity[data-state=saved] small { color: #a8d6b3; }
.project-sheet__identity[data-state=error] small { color: #ff9d8e; }
.project-transfer { margin-top: 10px; padding-top: 10px; border-top: 1px solid #425762; }
.project-transfer[hidden] { display: none; }
.project-transfer h3 { margin: 0; color: #eee1b3; font-size: 14px; }
.project-transfer .project-sheet__note { margin: 4px 0 8px; color: #bdc9cc; font-size: 11px; line-height: 1.4; }
.project-transfer__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.project-sheet .project-transfer__button { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; min-height: 44px; padding: 7px 9px; text-align: left; line-height: 1.3; overflow-wrap: anywhere; }
.project-transfer__button svg { color: #e5cb77; }
.project-transfer__button span { min-width: 0; }
.project-transfer__button:hover:not(:disabled) { border-color: #8a9ca1; background: #344957; }
.project-files__note { margin: 4px 0 8px; color: #bdc9cc; font-size: 11px; line-height: 1.45; }
.project-imports .project-list { grid-template-columns: minmax(0, 1fr); margin: 8px 0 0; }
.project-imports .project-card { min-height: 56px; }
.project-trash__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 7px 0; }
.project-trash__row span { min-width: 0; color: #c9d1d1; font-size: 12px; overflow-wrap: anywhere; }
.project-trash__row button { flex: none; }
.project-delete-dialog {
  box-sizing: border-box;
  width: min(390px, calc(100vw - 20px));
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 20px);
  overflow: auto;
  padding: 18px;
  border: 1px solid #607481;
  border-radius: 18px;
  background: #202f39;
  color: #f4f0e4;
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", system-ui, sans-serif;
  box-shadow: 0 24px 70px #0008;
}
.project-delete-dialog::backdrop { background: #080e16bb; }
.project-delete-dialog h2 { margin: 0 0 10px; color: #fff1bd; font-size: 17px; overflow-wrap: anywhere; }
.project-delete-dialog p { color: #c4d0d2; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.project-delete-dialog .project-sheet__actions { display: flex; gap: 8px; }
.project-delete-dialog button { flex: 1; min-width: 44px; min-height: 44px; padding: 9px; border: 1px solid #526979; border-radius: 10px; background: #15232d; color: inherit; font: inherit; font-size: 13px; }
.project-delete-dialog #project-delete-confirm { border-color: #d67c68; background: #d67c68; color: #171e22; font-weight: 700; }
.project-delete-dialog button:focus-visible { outline: 3px solid #ffe07d; outline-offset: 2px; }
.project-delete-dialog__preview { display: grid; place-items: center; min-height: 64px; max-height: 150px; margin: 5px auto 8px; overflow: hidden; }
.project-delete-dialog__preview canvas, .project-card-actions__preview canvas { display: block; width: min(100%, 160px); max-height: 140px; height: auto; object-fit: contain; image-rendering: pixelated; border: 1px solid #607687; border-radius: 10px; background: repeating-conic-gradient(#34414b 0 25%, #29353e 0 50%) 0 0 / 12px 12px; }
.project-delete-dialog .project-delete-dialog__name { margin: 5px 0 0; color: #f4f0e4; font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
.project-card-actions { width: min(360px, calc(100vw - 20px)); text-align: center; }
.project-card-actions__preview canvas { width: 72px; height: 72px; }
.project-card-actions__controls { display: grid; gap: 8px; }
.project-card-actions__controls button { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; }
.project-card-actions__controls svg { width: 22px; height: 22px; }
.project-card-actions #project-card-actions-open { border-color: #e2c56e; background: #e2c56e; color: #202a33; font-weight: 700; }
.project-card-actions #project-card-actions-delete { border-color: #805a52; color: #ffb2a3; }
.project-sheet[data-startup=true] .project-more { display: none; }
@media (max-width: 600px) {
  .project-bar { left: 8px; }
  .project-sheet { width: calc(100vw - 12px); padding-inline: 10px; border-radius: 15px; }
  .project-sheet__header { padding-top: 9px; }
  .project-sheet__heading h2 { font-size: 17px; }
  .project-sheet__toolbar { gap: 5px; }
  .project-sheet .project-tabs button { padding-inline: 3px; font-size: 11px; }
  .project-sheet__toolbar #project-new { padding-inline: 9px; font-size: 12px; }
  .project-list { grid-template-columns: minmax(0, 1fr); }
  .project-sheet .project-card { min-height: 82px; }
  .project-card canvas { width: 64px; height: 64px; }
  .project-sheet__current { padding: 8px; }
  .project-transfer__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 340px) {
  .project-sheet { padding-inline: 8px; }
  .project-sheet__heading h2 { font-size: 16px; }
  .project-sheet__toolbar #project-new { padding-inline: 7px; font-size: 11px; }
  .project-sheet .project-tabs button { font-size: 10px; }
  .project-sheet .project-list__row .project-card { gap: 7px; padding: 7px; }
  .project-card canvas { width: 64px; height: 64px; }
  .project-sheet__current { grid-template-columns: minmax(0, 1fr) auto; gap: 5px; }
  .project-sheet__current button { padding-inline: 7px; font-size: 11px; }
}
@media (min-width: 700px) {
  .project-sheet { padding-inline: 18px; }
  .project-list { gap: 10px; }
  .project-card canvas { width: 82px; height: 82px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-state=saving] .project-bar__state { animation: none; }
  .project-sheet :is(.project-card, .project-tabs button, #project-new) { transition: none; }
}

.project-delete-dialog__header{position:sticky;top:-18px;z-index:2;display:flex;align-items:start;gap:10px;margin:-18px -18px 10px;padding:12px 18px 8px;background:#202f39;border-radius:17px 17px 0 0}
.project-delete-dialog__header h2{flex:1;min-width:0;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-align:left}
.project-delete-dialog__header button{flex:none;min-width:44px;min-height:44px;font-size:22px}

/* Image-only, windowed library. Only the visible rows own canvas elements. */
.project-gallery-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.project-gallery-toolbar__count { flex: 1; min-width: 64px; font-size: 14px; font-weight: 700; color: #e9f6fa; }
.project-gallery-toolbar button { padding-inline: 10px; }
.project-gallery-toolbar [hidden], .project-gallery-actions[hidden], .project-gallery-toolbar[hidden] { display: none; }
.project-gallery-help { margin: 4px 0 8px; color: #acbdc6; font-size: 11px; }
.project-gallery.project-list { --gallery-columns: 3; display: block; position: relative; margin: 10px 0 16px; min-height: 48px; contain: layout style; }
.project-sheet .project-gallery__tile.project-card { position: absolute; display: grid; place-items: center; min-height: 44px; padding: 0; border: 0; border-radius: 2px; overflow: hidden; background: #101923; touch-action: pan-y; -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; transition: none; }
.project-gallery .project-gallery__tile canvas { width: 100%; height: 100%; max-width: none; border: 0; border-radius: 0; object-fit: contain; pointer-events: none; }
.project-gallery .project-gallery__tile[aria-current=true] { box-shadow: inset 0 0 0 2px #ffe08a; }
.project-gallery .project-gallery__tile[aria-current=true]::after { content: ''; position: absolute; inset: 0; border: 2px solid #ffe08a; pointer-events: none; }
.project-gallery .project-gallery__tile:focus-visible { outline-offset: -4px; outline: 3px solid #ffe07d; }
.project-gallery__check { display: none; position: absolute; z-index: 1; top: 6px; left: 6px; box-sizing: border-box; width: 24px; height: 24px; border: 2px solid #f6fbff; border-radius: 50%; background: #17242b88; color: transparent; line-height: 20px; text-align: center; font-weight: 800; font-size: 16px; pointer-events: none; }
.project-gallery[data-selecting=true] .project-gallery__check { display: block; }
.project-gallery [data-selected=true] .project-gallery__check { border-color: #61cfed; background: #61cfed; color: #092632; }
.project-gallery [data-selected=true] canvas { opacity: .65; }
.project-gallery-actions { position: sticky; z-index: 4; bottom: 0; display: flex; justify-content: center; padding: 9px 0 max(9px, env(safe-area-inset-bottom, 0px)); background: #1b2a34f5; border-top: 1px solid #536d7a; }
.project-gallery-actions button { min-width: 170px; border-color: #e7a397; color: #ffd2c9; font-weight: 700; }
.project-gallery-actions button:disabled { border-color: #526979; color: #bcc9ce; }
@media (min-width: 600px) { .project-gallery.project-list { --gallery-columns: 6; } }
@media (max-width: 340px) { .project-gallery-toolbar button { font-size: 12px; padding-inline: 7px; } }

/* Lightweight saved-work chooser shown before the editor runtime is loaded. */
.project-start-picker { z-index: 80; }
.project-start-picker > p { margin: 10px 0; color: #e8e3d6; }
.project-start-picker > input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid #647987; border-radius: 10px; background: #101a22; color: #fff; }
.project-start-picker__scroller { max-height: min(52dvh, 520px); overflow: auto; overscroll-behavior: contain; }
.project-start-picker__list { position: relative; min-height: 1px; }
.project-start-picker__list .project-gallery__tile { position: absolute; }
.project-start-picker .project-sheet__actions { justify-content: center; }
#project-start-new { min-height: 48px; font-size: 1.05rem; }
.project-start-picker #project-start-search { background: #101a22 !important; color: #f4f0e4 !important; }

/* One fixed, labelled banner after the initial chooser controls. */
.project-start-picker__ad {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  min-width: 0;
  margin: 48px 0 0;
  overflow: visible;
}
.project-start-picker__ad[hidden] { display: none; }
.project-start-picker__ad-label { margin: 0 0 4px; color: #c5d1d6; font-size: 12px; line-height: 16px; }
.project-start-picker__ad-slot { display: flex; flex: none; align-items: center; justify-content: center; max-width: 100%; overflow: visible; }
.project-start-picker__ad-slot ins { box-sizing: content-box; flex: none; max-width: 100%; overflow: visible; }
@media (max-width: 340px) {
  .project-start-picker { width: min(760px, calc(100vw - 4px)); padding-inline: 4px; }
}

/* Current work: one clear continuation action, with secondary operations below. */
.project-sheet__toolbar #project-new { border-color:#687982; background:#263944; color:#f4f0e4; }
.project-current-card { padding:12px; border:1px solid #667975; border-radius:15px; background:linear-gradient(135deg,#2c3e46,#15242d); }
.project-current-card .project-sheet__identity { margin:0 0 12px; padding:0; gap:12px; border:0; background:none; }
.project-sheet__preview { display:grid; place-items:center; flex:0 0 76px; width:76px; height:76px; overflow:hidden; border:1px solid #657681; border-radius:10px; background:repeating-conic-gradient(#34414b 0 25%,#29353e 0 50%) 0 0 / 12px 12px; }
.project-sheet__preview canvas { display:block; max-width:100%; max-height:100%; width:100%; height:100%; image-rendering:pixelated; object-fit:contain; }
.project-sheet__preview > svg { width:30px; height:30px; color:#e4cc7e; }
.project-sheet__preview [hidden] { display:none; }
.project-sheet__eyebrow { color:#adbdc4; font-size:10px; letter-spacing:.04em; }
.project-current-card .project-sheet__identity strong { font-size:16px; white-space:normal; overflow-wrap:anywhere; }
.project-current-card .project-sheet__identity small { margin-top:3px; font-size:11px; }
.project-sheet .project-continue { width:100%; min-height:48px; border-color:#f2d27a; background:linear-gradient(145deg,#ffe28b,#f1c657); color:#202a33; font-size:15px; font-weight:750; }
.project-rename-details { margin-top:5px; }
.project-sheet .project-rename-details > summary { min-height:44px; padding:11px 1px; border:0; background:none; color:#c9d5d9; font-size:12px; }
.project-current-card .project-sheet__current { margin:0; padding:0 0 4px; border:0; background:none; }
.project-image-import { display:flex; align-items:center; gap:12px; margin:12px 0 0; padding:0 0 12px; border-bottom:1px solid #425762; }
.project-image-import .project-sheet__actions { flex:none; margin:0; }
.project-image-import .project-sheet__note { margin:0; color:#b6c7cf; font-size:11px; line-height:1.5; }
.project-image-import + .project-transfer { margin-top:0; padding-top:12px; border-top:0; }
.project-transfer__button span { display:grid; gap:3px; }
.project-transfer__button strong { font-weight:650; }
.project-transfer__button small { color:#aebfc8; font-size:10px; }
.project-sheet .project-transfer__button { min-height:56px; }
@media (max-width:340px) {
  .project-current-card { padding:10px; }
  .project-sheet__preview { flex-basis:64px; width:64px; height:64px; }
  .project-image-import { gap:8px; }
  .project-image-import .project-sheet__note { font-size:10px; }
  .project-image-import button { padding-inline:8px; font-size:12px; }
}

/* Normal-flow manager banner, outside the thumbnails and all editing actions.
   48px is this site's conservative interaction gap, not a Google safe-harbor. */
.project-manager-ad { box-sizing:border-box; display:flex; flex-direction:column; align-items:center; width:100%; min-width:0; margin:48px 0; padding:0; }
.project-manager-ad[hidden] { display:none; }
.project-manager-ad__label { margin:0 0 4px; color:#c5d1d6; font-size:12px; line-height:16px; }
.project-manager-ad__slot { display:flex; align-items:center; justify-content:center; flex:none; max-width:100%; }
.project-manager-ad__slot ins { box-sizing:content-box; flex:none; max-width:100%; }

/* Segmented project gallery. Break nodes stay in normal flow between virtualized tile groups. */
.project-gallery--segmented .project-gallery__segment,
.project-gallery--segmented .project-gallery__tiles { position: relative; display: block; width: 100%; min-width: 0; }
.project-gallery--segmented .project-gallery__break { display: flow-root; width: 100%; min-width: 0; }
.project-gallery.project-gallery--segmented .project-gallery__tile.project-card {
  position: absolute; display: grid; place-items: center; min-height: 44px; padding: 0; border: 0; border-radius: 2px;
  overflow: hidden; background: #101923; touch-action: pan-y; -webkit-touch-callout: none; user-select: none;
  -webkit-user-select: none; transition: none;
}
.project-gallery--segmented .project-gallery__tile canvas {
  width: 100%; height: 100%; max-width: none; border: 0; border-radius: 0; object-fit: contain; pointer-events: none;
}
/* Keep chooser controls visible while the artwork feed scrolls on short phones. */
.project-start-picker[open] { display:flex; flex-direction:column; overflow:hidden; }
.project-start-picker > * { flex-shrink:0; }
.project-start-picker .project-start-picker__scroller { flex:1 1 auto; min-height:0; }

/* Import candidates share the same bounded square gallery as saved works. */
.project-import-pane .project-sheet__note { margin-block: 8px; }
.project-import-preview { display: flex; align-items: center; gap: 10px; margin-block: 10px; padding: 10px; border: 1px solid #526b7a; border-radius: 10px; background: #14232e; }
.project-import-preview[hidden], .project-import-preview [hidden], .project-gallery [hidden] { display: none; }
.project-import-preview > canvas, .project-import-preview__fallback { flex: 0 0 72px; width: 72px; height: 72px; object-fit: contain; image-rendering: pixelated; background: #101923; }
.project-import-preview__fallback { display: grid; place-items: center; font-size: 24px; }
.project-import-preview__info { min-width: 0; flex: 1; }
.project-import-preview h3 { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.project-import-preview .project-sheet__note { font-size: 11px; overflow-wrap: anywhere; }
.project-import-preview .project-sheet__actions { flex-wrap: wrap; }
.project-gallery__fallback { color: #c2cdd1; font-size: 24px; }
.project-gallery__badge { position: absolute; left: 3px; bottom: 3px; max-width: calc(100% - 6px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 2px 4px; border-radius: 3px; background: #101923e6; color: #fff0bf; font-size: 9px; pointer-events: none; }
@media (max-width: 380px) { .project-import-preview { align-items: flex-start; } .project-import-preview > canvas, .project-import-preview__fallback { flex-basis: 48px; width: 48px; height: 48px; } }

/* Save destinations stay explicit without adding work to the gallery data path. */
.project-storage-note { margin: 0 0 10px; color: #c3cfd0; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.project-backup { margin-top: 14px; padding: 12px; border: 1px solid #526979; border-radius: 12px; background: #172630; }
.project-backup h3 { margin: 0; color: #fff1bd; font-size: 14px; }
.project-backup .project-sheet__note { margin: 7px 0; color: #c3cfd0; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.project-backup button { width: 100%; margin-block: 4px; border-color: #a89356; color: #fff0bf; }
.project-empty-state { grid-column: 1 / -1; padding: 12px 8px 18px; text-align: center; }
.project-empty-state p { margin: 0 0 12px; }
.project-sheet .project-empty-state button { min-height: 48px; max-width: 100%; border-color: #f2d27a; background: #f1d073; color: #202a33; font-weight: 750; }
.project-start-picker__empty { margin-block: 8px; padding: 18px 10px; border: 1px solid #526979; border-radius: 12px; background: #172630; text-align: center; }
.project-start-picker__empty[hidden] { display: none; }
.project-start-picker__empty-title { margin: 0 0 8px; color: #fff1bd; font-size: 16px; }
.project-start-picker__empty-copy { margin: 0 0 14px; color: #c3cfd0; font-size: 13px; line-height: 1.5; }
.project-sheet .project-start-picker__empty-create { min-height: 48px; max-width: 100%; border-color: #f2d27a; background: #f1d073; color: #202a33; font-weight: 750; }