/* Frontend-only finish. Loaded after shared styles; admin does not load this file. */
:root[data-theme] {
  --ui-bg:#e9edf1; --ui-card:#f8fafc; --ui-soft:#edf0f4; --ui-input:#ffffffb8;
  --ui-text:#20252b; --ui-muted:#626a75; --ui-line:#27344616; --ui-border:#27344625;
  --ui-selected:#ffffffda; --ui-header:#f7f9fbbb;
  --glass-panel:#f7f9fbbd; --glass-control:#ffffff70; --glass-edge:#ffffffdb;
  --glass-shadow:0 12px 40px -20px #26374a35,inset 0 1px 0 #ffffffd9;
  --glass-stage:linear-gradient(145deg,#ffffffb5,#f0f3f66b);
}
:root[data-theme=dark] {
  --ui-bg:#15191e; --ui-card:#272d35; --ui-soft:#ffffff08; --ui-input:#ffffff09;
  --ui-text:#f0f2f5; --ui-muted:#b0b8c3; --ui-line:#ffffff12; --ui-border:#ffffff24;
  --ui-selected:#ffffff17; --ui-header:#20262dbd;
  --glass-panel:#292f38a8; --glass-control:#ffffff09; --glass-edge:#ffffff29;
  --glass-shadow:0 14px 40px -24px #0009,inset 0 1px 0 #ffffff14;
  --glass-stage:linear-gradient(145deg,#ffffff09,#ffffff02);
}
body {
  background:radial-gradient(ellipse at 12% 0%,#a7bdce22,transparent 52%),
    radial-gradient(ellipse at 90% 42%,#bac6cf18,transparent 58%),var(--ui-bg);
  min-height:100vh;
}
[data-theme] .site-header {
  background:var(--ui-header); border-bottom:1px solid var(--ui-line);
  -webkit-backdrop-filter:blur(24px) saturate(125%);backdrop-filter:blur(24px) saturate(125%);
}
[data-theme] .workspace {padding-top:28px}
[data-theme] :is(.settings-panel,.image-adjustments,.layer-panel,.recovery-banner) {
  background:var(--glass-panel);border:1px solid var(--glass-edge);border-radius:20px;
  box-shadow:var(--glass-shadow);
  -webkit-backdrop-filter:blur(22px) saturate(115%);backdrop-filter:blur(22px) saturate(115%);
}
[data-theme] .stage {
  background:var(--glass-stage);border:1px solid var(--glass-edge);border-radius:24px;
  box-shadow:var(--glass-shadow);
}
/* No filter on artwork/canvas: previews retain their original sharpness and colour. */
[data-theme] .stage-kicker {font-size:10px;letter-spacing:1px}
[data-theme] .stage-bottom {font-size:11px}
[data-theme] .mode-switch {
  background:var(--glass-control);border:1px solid var(--ui-line);border-radius:14px;padding:4px;
  box-shadow:inset 0 1px 0 var(--glass-edge);
}
[data-theme] .mode-switch button {border-radius:10px;font-weight:500}
[data-theme] .mode-switch button[aria-pressed=true] {
  background:var(--ui-selected);box-shadow:0 2px 7px #00000012,inset 0 1px 0 var(--glass-edge);
}
[data-theme] :is(.icon-button,.theme-toggle,.secondary-button,.alignment-buttons button,.fill-mode,.layer-actions button,.font-import) {
  background:var(--glass-control);border:1px solid var(--ui-border);color:var(--ui-text);
  box-shadow:inset 0 1px 0 var(--glass-edge);border-radius:10px;
}
[data-theme] .icon-button {width:36px;height:36px}
[data-theme] .theme-toggle {min-height:38px}
[data-theme] .language-picker select {background:var(--glass-control);border-color:var(--ui-border);color:var(--ui-text);border-radius:10px}
[data-theme] .section-heading h2 {font-size:15px;font-weight:600;letter-spacing:0}
[data-theme] .section-heading h2>span {font-weight:400;opacity:.7}
[data-theme] .setting-section {padding:22px;border-color:var(--ui-line)}
[data-theme] .preset-grid button {
  background:var(--glass-control);border:1px solid var(--ui-line);border-radius:9px;
  font-size:12px;padding:11px 4px;box-shadow:none;
}
[data-theme] .preset-grid button[aria-pressed=true] {
  background:var(--ui-accent);color:var(--ui-on-accent);border-color:transparent;box-shadow:0 2px 6px #00000012;
}
[data-theme] :is(.field-row select,.field-row input,.text-input,.text-font-row select,.text-style-options select,.export-options>select,.edge-color-field>select) {
  background:var(--ui-input);border:1px solid var(--ui-border);border-radius:10px;
  box-shadow:inset 0 1px 2px #00000004;
}
[data-theme] select option,[data-theme] select optgroup {background:var(--ui-card);color:var(--ui-text)}
[data-theme] :is(.fabric-intro,.custom-size-fields,.price-note,.save-area .price-note) {background:var(--ui-soft);border:1px solid var(--ui-line);border-radius:12px}
[data-theme] .fabric-intro {padding:12px}
[data-theme] .upload-zone {background:var(--glass-control);border-color:var(--ui-border);border-radius:12px}
[data-theme] :is(.primary-button,.apply-size-button) {border-radius:11px;font-weight:600;box-shadow:0 2px 8px #00000012}
[data-theme] .layer-panel {padding:18px}
[data-theme] .layer-item {background:var(--glass-control)}
[data-theme] .layer-item[aria-pressed=true] {background:var(--ui-selected)}
[data-theme] .image-adjustment-heading {font-weight:600}
[data-theme] :is(.submit-dialog,.design-library,.material-image-dialog) {
  background:var(--glass-panel);border:1px solid var(--glass-edge);box-shadow:0 24px 90px #0005,inset 0 1px 0 var(--glass-edge);
  -webkit-backdrop-filter:blur(32px) saturate(120%);backdrop-filter:blur(32px) saturate(120%);
}
[data-theme] dialog::backdrop {background:#0b101947;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
[data-theme] button {transition:background-color .16s,border-color .16s,box-shadow .16s}
@media(hover:hover) {
  [data-theme] :is(.theme-toggle,.secondary-button,.alignment-buttons button,.layer-actions button,.icon-button):hover:not(:disabled) {background:var(--ui-selected);border-color:var(--glass-edge)}
}
@media(min-width:1100px) {
  .editor-grid {grid-template-columns:minmax(0,1fr) 340px;gap:28px}
}
@media(max-width:760px) {
  [data-theme] .workspace {padding-top:16px}
  [data-theme] .site-header {height:auto;min-height:0;padding-top:14px;padding-bottom:14px}
  [data-theme] .icon-button {width:44px;height:44px}
  [data-theme] :is(.settings-panel,.image-adjustments,.layer-panel) {border-radius:18px}
  [data-theme] .setting-section {padding:20px}
  [data-theme] .purchase-bar {
    background:var(--ui-header);border-top:1px solid var(--glass-edge);box-shadow:0 -8px 28px #0000000c;
    -webkit-backdrop-filter:blur(24px) saturate(125%);backdrop-filter:blur(24px) saturate(125%);
  }
  /* A filtered ancestor would trap the fixed purchase bar inside the settings panel. */
  [data-theme] .settings-panel {backdrop-filter:none;-webkit-backdrop-filter:none}
  [data-theme] .layer-actions {background:transparent}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  [data-theme] :is(.site-header,.settings-panel,.image-adjustments,.layer-panel,.recovery-banner,.purchase-bar,dialog) {background:var(--ui-card)}
}
@media(prefers-reduced-transparency:reduce) {
  [data-theme] :is(.site-header,.settings-panel,.image-adjustments,.layer-panel,.recovery-banner,.purchase-bar,dialog) {background:var(--ui-card);backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(prefers-reduced-motion:reduce) {[data-theme] button {transition:none}}

/* Studio layout: one canvas, one specification rail, contextual editing. */
:root[data-theme] {--ui-bg:#f3f4f5;--glass-edge:#242a3214;--glass-shadow:none;--glass-panel:#ffffff85}
:root[data-theme=dark] {--ui-bg:#17191c;--glass-edge:#ffffff12;--glass-panel:#ffffff04;--glass-shadow:none}
body {background:var(--ui-bg)}
[data-theme] .site-header {height:72px;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.studio-heading {margin:0 0 28px;display:flex;align-items:baseline;gap:20px}
.studio-heading h1 {font-size:24px;letter-spacing:-.6px;font-weight:600;margin:0}
.studio-heading p {font-size:13px;color:var(--ui-muted);margin:0}
[data-theme] .workspace {max-width:1600px;padding:32px 4vw}
[data-theme] .editor-grid {gap:40px;grid-template-columns:minmax(0,1fr) 320px}
[data-theme] .settings-panel {background:transparent;border:0;border-left:1px solid var(--ui-line);border-radius:0;padding-left:28px;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
[data-theme] .setting-section {padding:0 0 24px;border:0}
[data-theme] .section-heading h2 {font-size:16px}
[data-theme] .stage {border-radius:18px;height:clamp(360px,48vh,580px);background:var(--glass-stage);box-shadow:none}
[data-theme] .stage-kicker {opacity:.7}
[data-theme] .stage-kicker>span:first-child {visibility:hidden}
[data-theme] .mode-switch {background:transparent;border:0;box-shadow:none;padding:0;gap:4px}
[data-theme] .mode-switch button {padding:10px 16px}
[data-theme] .mode-switch button[aria-pressed=true] {box-shadow:none;background:var(--ui-selected)}
[data-theme] .view-toolbar {justify-content:flex-start;padding:10px 0;margin-bottom:12px}
[data-theme] .artwork-upload {padding:0 0 20px;border-bottom:1px solid var(--ui-line)}
[data-theme] .artwork-upload .section-heading {display:none}
[data-theme] .upload-zone {display:grid;grid-template-columns:auto 1fr;column-gap:14px;text-align:left;padding:16px 20px;background:transparent;border-radius:12px}
.upload-zone .upload-symbol {grid-row:1/3;margin:0;font-size:26px}
[data-theme] .upload-zone strong {font-size:14px;font-weight:500}
[data-theme] .layer-panel {background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:18px 0;margin:0}
.layer-panel>.layer-help {display:none}
.layer-panel:has(#layer-empty:not([hidden])) .layer-actions {display:none}
[data-theme] .layer-heading {margin-bottom:12px}
[data-theme] .layer-add .secondary-button {border:0;background:transparent;box-shadow:none;padding:6px 10px}
[data-theme] .layer-heading strong {font-size:13px;font-weight:500}
[data-theme] .image-adjustments {border:0;border-top:1px solid var(--ui-line);border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:20px 0}
.mobile-more {display:block;border-top:1px solid var(--ui-line);margin-top:18px}
.mobile-more summary,.quiet-details>summary {cursor:pointer;font-size:12px;color:var(--ui-muted);padding:14px 0;min-height:44px}
.mobile-more summary:hover,.quiet-details>summary:hover {color:var(--ui-text)}
.quiet-details {border-top:1px solid var(--ui-line);margin-top:12px}
[data-theme] .material-details .fabric-intro {border:0;background:transparent;padding:0}
[data-theme] .model-size-note {display:none}
[data-theme] .edge-color-field {margin-top:18px}
[data-theme] .fixed-spec {margin-bottom:0}
[data-theme] .save-area {padding:20px 0 0;border-top:1px solid var(--ui-line)}
[data-theme] .save-area .price-note {background:transparent;border:0;padding:0;font-size:20px;font-weight:500}
[data-theme] .submission-area {border:0;margin:0;padding-bottom:8px}
[data-theme] #save-draft {margin-top:4px;background:transparent;box-shadow:none;border-color:var(--ui-line)}
[data-theme] .export-options {margin:0;padding:0;border:0}
[data-theme] .recovery-banner {border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0 0 16px;font-size:12px;color:var(--ui-muted)}
[data-theme] .palette-panel {border-top:1px solid var(--ui-line);padding-top:18px}
[data-theme] .preview-note {margin-top:16px}
@media(min-width:761px) {
  .settings-panel {position:sticky;top:24px}
}
@media(max-width:1000px) and (min-width:761px) {
  [data-theme] .editor-grid {grid-template-columns:minmax(0,1fr) 280px;gap:24px}
  [data-theme] .settings-panel {padding-left:20px}
}
@media(max-width:760px) {
  [data-theme] .workspace {padding:20px 14px}
  [data-theme] .site-header {height:auto}
  .studio-heading {display:block;margin-bottom:20px}
  .studio-heading h1 {font-size:22px}
  .studio-heading p {margin-top:7px;font-size:12px}
  [data-theme] .editor-grid {grid-template-columns:1fr;gap:24px}
  [data-theme] .stage {height:clamp(240px,34svh,340px)}
  [data-theme] .settings-panel {display:block;border:0;border-top:1px solid var(--ui-line);padding:24px 0 0}
  [data-theme] .setting-section {padding:0}
  [data-theme] .save-area {margin-top:20px}
  .artwork-upload {display:none}
  [data-theme] .mobile-tools {margin-bottom:0}
  [data-theme] .mobile-tools>.layer-add .secondary-button {background:var(--ui-selected);box-shadow:none;border:0}
  [data-theme] .layer-panel {padding-top:10px}
  [data-theme] .design-summary {white-space:normal}
  [data-theme] .design-summary span:first-child {white-space:normal}
}
[data-theme] .site-header {min-height:64px}
[data-theme] .workspace {padding-top:24px}
.studio-heading {margin-bottom:20px}
[data-theme] .recovery-banner {padding-bottom:12px}
[data-theme] .edge-color-field:has(#style-detail:empty) {margin-top:0}
[data-theme] .custom-size-button {border-style:solid;background:transparent;box-shadow:none}
[data-theme] .fixed-spec {font-size:11px;opacity:.8}
[data-theme] .edge-color-field {margin-top:12px}
[data-theme] .quiet-details {margin-top:8px}
[data-theme] .quiet-details>summary {padding:10px 0}
[data-theme] .setting-section {padding-bottom:12px}
[data-theme] .save-area {padding-top:14px}

/* Mobile starts with product choices. */
.mobile-specifications {display:none}
@media(max-width:760px) {
  .mobile-specifications {display:block;min-width:0;border-bottom:1px solid var(--ui-line);padding-bottom:12px}
  .mobile-specifications .preset-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
  .mobile-specifications .section-heading {margin-bottom:12px}
  .mobile-specifications .fixed-spec {display:none}
  [data-theme] .settings-panel {padding-top:0}
}

/* A single specification card groups size, material and finishing choices. */
[data-theme] #product-specifications {padding:18px;border:1px solid var(--ui-line);border-radius:16px;background:var(--ui-selected)}
[data-theme] #product-specifications .section-heading {margin-bottom:14px}
[data-theme] #product-specifications .section-heading h2 {font-size:15px;font-weight:600}
[data-theme] #product-specifications .edge-color-field {margin-top:12px}
[data-theme] #product-specifications .fabric-field {margin-top:16px}
[data-theme] #product-specifications .custom-size-button {margin-top:8px}
[data-theme] #product-specifications .material-details {margin-top:4px;border:0}
[data-theme] #product-specifications .material-details>summary {padding:8px 0;min-height:36px}
@media(max-width:760px) {
  .mobile-specifications {border:0;padding-bottom:0}
  [data-theme] #product-specifications {padding:16px}
  [data-theme] #product-specifications .preset-grid {gap:6px}
  [data-theme] #product-specifications .preset-grid button {min-height:40px;padding:8px 4px}
  [data-theme] #product-specifications .custom-size-button {min-height:40px;padding:8px}
  [data-theme] #product-specifications select {min-height:44px}
  [data-theme] #product-specifications .size-helper {font-size:11px;line-height:1.5}
}

[data-theme] .layer-add {display:flex;flex-wrap:nowrap;gap:8px}
[data-theme] .layer-add .secondary-button {white-space:nowrap;min-height:44px}
[data-theme] .background-dialog {width:min(420px,calc(100% - 28px));background:var(--ui-card);color:var(--ui-text)}
[data-theme] .background-dialog .palette-panel {border:0;margin:0;padding-top:20px}
.background-dialog .color-swatches {grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.background-dialog .color-swatch {height:auto;aspect-ratio:1;min-height:0}
.background-dialog .dialog-heading h2 {font-size:17px}
@media(max-width:760px) {
  [data-theme] .mobile-tools>.layer-add {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  [data-theme] .mobile-tools>.layer-add .secondary-button {font-size:12px;padding:8px 3px;min-width:0}
}

/* Keep preview, editing and layers in one surface, followed by a quiet summary. */
[data-theme] .editor-card {border:1px solid var(--ui-line);border-radius:16px;background:var(--ui-selected);padding:18px;overflow:hidden}
[data-theme] .editor-card .preview-toolbar {margin-bottom:12px}
[data-theme] .editor-card .stage {border:1px solid var(--ui-line);border-radius:12px;box-shadow:none}
[data-theme] .editor-card .image-adjustments {padding:16px 0 4px;margin:12px 0 0}
[data-theme] .editor-card .layer-panel {padding:16px 0 0}
[data-theme] .editor-card .layer-item {box-shadow:none;border-color:var(--ui-line)}
[data-theme] .editor-card .layer-item[aria-pressed=true] {border-color:var(--ui-accent);box-shadow:inset 2px 0 0 var(--ui-accent)}
[data-theme] .editor-card .layer-actions {gap:6px}
[data-theme] .editor-card .layer-actions button {padding:8px 10px;min-height:36px}
[data-theme] .editor-card .edit-toolbar {justify-content:flex-end;padding:12px 0 0;gap:0;margin:0}
.editor-card .edit-toolbar>span {display:none}
[data-theme] .editor-card .edit-toolbar .check-label {font-size:11px}
[data-theme] .editor-card .mobile-more {margin-top:12px}
[data-theme] .editor-card .layer-add .secondary-button {background:var(--ui-input);border:1px solid var(--ui-line);border-radius:10px}
[data-theme] .design-overview {margin-top:16px;border:1px solid var(--ui-line);border-radius:16px;padding:18px;background:transparent}
.design-overview h2 {font-size:13px;font-weight:600;margin:0 0 8px;color:var(--ui-text)}
.overview-list {margin:0}
.overview-list>div {display:grid;grid-template-columns:70px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--ui-line)}
.overview-list>div:last-child {border:0}
.overview-list dt {font-size:11px;color:var(--ui-muted);line-height:1.7}
.overview-list dd {margin:0;font-size:12px;line-height:1.65;color:var(--ui-text);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
[data-theme] .design-overview .preview-note {margin:10px 0 0;padding-top:10px;border-top:1px solid var(--ui-line);font-size:10px;line-height:1.7}
@media(max-width:760px) {
  [data-theme] .editor-card {padding:12px}
  [data-theme] .editor-card .stage {height:clamp(240px,34svh,340px)}
  [data-theme] .editor-card .stage-kicker {left:14px;right:14px}
  [data-theme] .editor-card .stage-bottom {left:14px;right:14px;font-size:9px}
  [data-theme] .editor-card .mobile-tools>.layer-add {margin:12px 0 0}
  [data-theme] .editor-card .text-adjustment-options {grid-template-columns:100px minmax(0,1fr);align-items:center;gap:14px}
  [data-theme] .editor-card .image-adjustment-heading {margin-bottom:10px}
  [data-theme] .editor-card .layer-actions {display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
  [data-theme] .editor-card .layer-actions button {padding:7px 2px;font-size:10px}
  [data-theme] .design-overview {padding:14px}
  .overview-list>div {grid-template-columns:60px minmax(0,1fr);gap:10px}
}
@media(max-width:760px) {
  [data-theme] .editor-card .color-row {gap:6px;white-space:nowrap;font-size:11px}
  [data-theme] .editor-card .color-row input {width:36px;height:36px;flex-shrink:0}
}
[data-theme] .design-overview #spec-summary {font-weight:400}
@media(max-width:760px) {
  [data-theme] .settings-panel {border:0}
  [data-theme] .settings-panel .save-area {border:0;margin-top:0;padding-top:0}
}

.touch-edit-option {display:none}
#stage:not(.touch-edit-enabled) :is(#view2d,#view3d) {touch-action:pan-y pinch-zoom}
@media(pointer:coarse),(max-width:760px) {
  .touch-edit-option {display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-2px 0 8px;font-size:10px;color:var(--ui-muted);min-height:36px}
  .touch-edit-switch {display:flex;align-items:center;gap:8px;min-height:36px;color:var(--ui-text);font-size:12px;white-space:nowrap;cursor:pointer}
  .touch-edit-switch input {appearance:none;-webkit-appearance:none;position:relative;margin:0;width:34px;height:20px;border:1px solid var(--ui-border);border-radius:20px;background:var(--ui-input);cursor:pointer;flex-shrink:0}
  .touch-edit-switch input::before {content:'';position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--ui-muted);transition:transform .15s}
  .touch-edit-switch input:checked {border-color:var(--ui-accent)}
  .touch-edit-switch input:checked::before {transform:translateX(14px);background:var(--ui-text)}
  .touch-edit-switch input:focus-visible {outline:2px solid var(--ui-accent);outline-offset:3px}
  #stage:not(.touch-edit-enabled) #transform-frame {visibility:hidden;pointer-events:none}
  #stage:not(.touch-edit-enabled) .transform-handle {pointer-events:none}
}

/* Submission dialog: fixed header, one scrollable body, compact receipt. */
[data-theme] #submit-dialog,
[data-theme] #submit-dialog:has(#submit-result:not([hidden])) {width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:0;border-radius:20px;background:var(--ui-card);overflow:hidden;backdrop-filter:none;-webkit-backdrop-filter:none}
[data-theme] #submit-dialog[open] {display:flex;flex-direction:column}
[data-theme] #submit-dialog:has(#submit-result:not([hidden])) {width:min(760px,calc(100% - 24px))}
[data-theme] #submit-dialog>.dialog-heading,
[data-theme] #submit-dialog:has(#submit-result:not([hidden]))>.dialog-heading {position:static;flex-shrink:0;padding:12px 18px;margin:0;background:transparent;border-bottom:1px solid var(--ui-line);gap:12px}
#submit-dialog>.dialog-heading h2 {font-size:18px;line-height:1.4;font-weight:600}
#submit-dialog #submit-close {min-height:40px;min-width:44px;font-size:13px;padding:6px;white-space:nowrap}
.submit-dialog-body {overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:12px 18px 18px;-webkit-overflow-scrolling:touch}
#submit-dialog #submission-status {font-size:11px;margin:0 0 12px;line-height:1.5}
#submit-dialog .checkout-layout {gap:18px;grid-template-columns:minmax(0,1fr) 208px}
#submit-dialog .checkout-step {font-size:12px;margin:0 0 8px;font-weight:500}
.submission-code-row {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:8px}
#submit-dialog #submission-number {display:flex;align-items:center;font-size:14px;line-height:1.5;padding:10px;margin:0;border-radius:10px;overflow-wrap:anywhere;word-break:break-all}
#submit-dialog #copy-submission {margin:0;padding:8px 10px;min-height:42px;width:auto;font-size:11px;border-radius:10px;white-space:nowrap}
#submit-dialog .checkout-price-summary {margin:12px 0 8px;padding:12px;border-radius:12px}
#submit-dialog .checkout-price-summary>p:first-child {font-size:11px;color:var(--ui-muted)}
#submit-dialog #checkout-amount {font-size:28px;line-height:1.2;margin:4px 0 6px}
#submit-dialog #checkout-quantity {font-size:12px;line-height:1.5;font-weight:500}
#submit-dialog .checkout-reminder {font-size:11px;line-height:1.55;margin:0}
#submit-dialog .checkout-block {padding-left:16px}
#submit-dialog .checkout-block img {width:176px;height:176px;margin:4px auto 10px}
#submit-dialog .checkout-block a {min-height:42px;font-size:12px;padding:8px}
#submit-dialog #submit-review p {font-size:12px;line-height:1.65}
#submit-dialog #submit-review .submit-preview {max-height:180px;margin:12px auto}
#submit-dialog #submit-confirm {margin-top:12px;min-height:44px}
@media(max-width:640px) {
  [data-theme] #submit-dialog,
  [data-theme] #submit-dialog:has(#submit-result:not([hidden])) {max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:18px}
  [data-theme] #submit-dialog>.dialog-heading,
  [data-theme] #submit-dialog:has(#submit-result:not([hidden]))>.dialog-heading {padding:8px 14px}
  .submit-dialog-body {padding:12px 14px 14px}
  #submit-dialog .checkout-layout {grid-template-columns:1fr;gap:12px}
  #submit-dialog .checkout-block {padding:12px 0 0;border:0;border-top:1px solid var(--ui-line)}
  #submit-dialog .checkout-block img {width:144px;height:144px;margin:6px auto 10px}
  #submit-dialog #submission-number {font-size:12px;padding:8px}
}

/* Make the complete touch-edit strip a clear, comfortable tap target. */
@media(pointer:coarse),(max-width:760px) {
  .touch-edit-option.touch-edit-switch {display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px;margin:0 0 12px;min-height:68px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-input);white-space:normal}
  .touch-edit-copy {display:flex;flex-direction:column;gap:5px;min-width:0}
  .touch-edit-title {font-size:14px;font-weight:600;line-height:1.3;color:var(--ui-text)}
  .touch-edit-option #touch-edit-status {font-size:11px;line-height:1.45;color:var(--ui-muted)}
  .touch-edit-switch input {width:50px;height:30px;border-radius:30px;background:var(--ui-selected)}
  .touch-edit-switch input::before {width:24px;height:24px;left:2px;top:2px;background:var(--ui-muted)}
  .touch-edit-switch input:checked {background:var(--ui-text);border-color:var(--ui-text)}
  .touch-edit-switch input:checked::before {transform:translateX(20px);background:var(--ui-card)}
  .touch-edit-option:has(input:checked) {border-color:var(--ui-text)}
  .touch-edit-option:has(input:checked) #touch-edit-status {color:var(--ui-text)}
}

/* A bounded style menu, shared across Android, iOS and desktop. */
[data-theme] .style-picker-trigger {
  display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:46px;
  padding:12px 14px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-input);
  color:var(--ui-text);font:inherit;font-size:14px;text-align:left;cursor:pointer;
}
.style-picker-trigger[hidden],#fabric[hidden] {display:none!important}
.style-picker-trigger span {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.style-picker-trigger i {flex:0 0 8px;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 3px 4px 0;opacity:.7}
[data-theme] .style-picker-trigger:focus-visible {outline:2px solid var(--ui-muted);outline-offset:3px}
[data-theme] .style-picker-dialog {
  box-sizing:border-box;width:min(360px,calc(100vw - 32px));max-width:none;max-height:min(520px,65vh);
  max-height:min(520px,65dvh);padding:0;margin:auto;overflow:hidden;border:1px solid var(--glass-edge);
  border-radius:22px;color:var(--ui-text);background:var(--ui-card);box-shadow:0 20px 80px #0005;
  -webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);
}
[data-theme=dark] .style-picker-dialog {background:#292d33ed}
[data-theme=light] .style-picker-dialog {background:#f8fafcf2}
.style-picker-dialog[open] {display:flex;flex-direction:column}
.style-picker-dialog::backdrop {background:#0004}
.style-picker-heading {display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-bottom:1px solid var(--ui-line)}
.style-picker-heading h2 {margin:0;font-size:15px;font-weight:600;letter-spacing:0}
[data-theme] .style-picker-close {min-height:36px;padding:6px 8px;border:0;background:transparent;color:var(--ui-muted);font:inherit;font-size:13px;cursor:pointer}
.style-picker-list {min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:4px 8px 10px;scroll-padding:8px}
.style-picker-group {padding:12px 12px 6px;font-size:11px;font-weight:500;color:var(--ui-muted)}
.style-picker-list [role=group]+[role=group] {border-top:1px solid var(--ui-line);margin-top:6px}
[data-theme] .style-picker-option {display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:10px 12px;border:0;border-radius:10px;text-align:left;background:transparent;color:var(--ui-text);font:inherit;cursor:pointer}
[data-theme] .style-picker-option[aria-selected=true] {background:var(--ui-selected)}
[data-theme] .style-picker-option:focus-visible {outline:2px solid var(--ui-muted);outline-offset:-2px}
.style-picker-copy {display:grid;gap:4px;min-width:0;flex:1}
.style-picker-name {font-size:14px;line-height:1.4;overflow-wrap:anywhere;font-weight:500}
.style-picker-detail {font-size:12px;line-height:1.4;color:var(--ui-muted);white-space:normal}
.style-picker-check {width:18px;flex:0 0 18px;font-size:17px;text-align:center}
.style-picker-option:disabled {opacity:.45;cursor:default}
.style-picker-empty {margin:20px 12px;color:var(--ui-muted);font-size:13px}
@media(prefers-reduced-transparency:reduce) {[data-theme] .style-picker-dialog {background:var(--ui-card);backdrop-filter:none;-webkit-backdrop-filter:none}}