.qp-body {
  min-height: 100vh;
  overflow: hidden;
  background: var(--ui-bg);
}
.qp-visually-hidden { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.qp-body .topbar #topbarClubName { display:block;max-width:180px;min-width:0;font-size:11px; }
.qp-body #topbarClubName strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
html[data-app-interface="quick-publish"] .qp-info { display:none; }

/* Scorer list: real touch targets, compact scrollable roster, explicit override. */
.qp-scorer-picker { display:block; max-height:280px; overflow:auto; border:1px solid var(--ui-border); border-radius:10px; }
.qp-scorer-picker .qp-scorer { display:grid; grid-template-columns:minmax(0,1fr) 44px 32px 44px; align-items:center; gap:4px; padding:4px 8px; border-bottom:1px solid var(--ui-border); }
.qp-scorer-picker .qp-scorer[hidden] { display:none; }
.qp-scorer-picker [data-scorer-group][hidden],.qp-scorer-suggestions button[hidden] { display:none; }
.qp-scorer-picker h3,.qp-scorer-suggestions h3 { margin:0; padding:8px; font:600 13px/1.3 var(--font-body); }
.qp-scorer-picker h3 { background:var(--ui-surface2); border-bottom:1px solid var(--ui-border); }
.qp-scorer-picker summary { min-height:44px;padding:12px 8px;background:var(--ui-surface2);border-bottom:1px solid var(--ui-border);cursor:pointer;font:600 13px/1.3 var(--font-body); }
.qp-scorer-picker summary small { float:right;font-size:11px;font-weight:400; }
#qpScorersSection[hidden],.qp-scorer-mode[hidden] { display:none; }
.qp-field-heading { display:flex;align-items:center;gap:6px; }
.qp-score-row .qp-field-heading { min-height:24px; }
.qp-info { display:inline-flex;position:relative;vertical-align:middle; }
.qp-info-button { width:24px;height:24px;min-height:24px;padding:0;border:1px solid var(--ui-border);border-radius:50%;background:var(--ui-surface2);color:var(--ui-text2);font:600 12px/1 var(--font-body);cursor:help; }
.qp-tooltip { display:none;position:fixed;z-index:6000;width:min(290px,70vw);padding:10px 12px;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-surface);color:var(--ui-text);box-shadow:0 4px 16px #0002;font:400 12px/1.45 var(--font-body);text-transform:none;letter-spacing:normal; }
.qp-info:hover>.qp-tooltip,.qp-info:focus-within>.qp-tooltip,.qp-info[data-open="1"]>.qp-tooltip { display:block; }
.qp-scorer-suggestions { display:grid; gap:6px; }
.qp-scorer-suggestions h3 { padding:0; }
.qp-scorer-suggestions button { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; border:1px solid var(--ui-border); border-radius:8px; background:var(--ui-surface2); color:var(--ui-text); padding:8px; cursor:pointer; font:600 12px/1.3 var(--font-body); }
.qp-scorer-suggestions small { font-weight:400; color:var(--ui-text2); }
.qp-scorer-suggestions button:disabled { opacity:.5; cursor:default; }
.qp-scorer small { display:block; opacity:.65; font-size:11px; }
.qp-scorer-picker button { min-width:44px; min-height:44px; border:1px solid var(--ui-border); border-radius:8px; background:var(--ui-bg); color:var(--ui-text); font-size:20px; cursor:pointer; }
.qp-scorer-picker output { text-align:center; font-weight:700; }
.qp-scorer-picker button:disabled { opacity:.35; cursor:default; }
.qp-scorer-mode { font-size:12px; display:flex; align-items:center; gap:8px; margin:8px 0; }
#qpScorerSearch { width:100%; min-height:44px; margin-bottom:8px; }
.qp-upload { touch-action:manipulation; }
.qp-media-dialog { width:min(960px,94vw); max-height:90vh; border:1px solid var(--ui-border); border-radius:16px; padding:20px; background:var(--ui-bg); color:var(--ui-text); }
.qp-media-dialog::backdrop { background:rgba(0,0,0,.55); }
.qp-media-toolbar { display:flex; gap:8px; align-items:center; margin:12px 0; }
.qp-media-toolbar input,.qp-media-toolbar select { min-width:0; flex:1; }
.qp-media-dialog button,.qp-media-dialog select,.qp-media-dialog input,[data-draft-clear],[data-scorer-restore] { min-height:44px; border:1px solid var(--ui-border); border-radius:8px; padding:8px; cursor:pointer; }
.qp-media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; }
.qp-media-tile { min-width:0; }
.qp-media-pick { display:block; width:100%; text-align:left; background:var(--ui-bg); color:inherit; }
.qp-media-pick img { width:100%; height:130px; object-fit:contain; display:block; border-radius:6px; }
.qp-media-pick span { display:block; overflow-wrap:anywhere; font-size:12px; padding-top:6px; }
.qp-media-tile select { width:100%; margin-top:6px; font-size:11px; }
@media(max-width:600px) { .qp-media-toolbar { flex-wrap:wrap; } .qp-media-toolbar input { flex-basis:100%; } .qp-media-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.qp-shell {
  height: calc(100vh - var(--topbar-h));
  display: grid;
  grid-template-columns: minmax(360px, 430px) minmax(0, 1fr);
}

.qp-controls {
  min-width: 0;
  overflow-y: auto;
  padding: 24px;
  border-right: 1px solid var(--ui-border);
  background: var(--ui-surface);
}

.qp-heading,
.qp-preview-head,
.qp-export-bar,
.qp-row {
  display: flex;
  align-items: center;
}

.qp-heading { justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.qp-heading h1 { margin: 0; font: 600 27px/1.15 var(--font-body); }
.qp-eyebrow { margin-bottom: 4px; color: var(--b1); font-size: 11px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }
.qp-step { padding: 5px 8px; border-radius: 999px; background: var(--ui-surface2); color: var(--ui-text2); font-size: 10px; font-weight: 700; }

.qp-template-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 18px;
}

.qp-template {
  min-width: 0;
  border: 1px solid var(--ui-border);
  border-radius: 9px;
  padding: 10px 7px;
  background: var(--ui-surface2);
  color: var(--ui-text);
  cursor: pointer;
  text-align: left;
}
.qp-template:hover { border-color: var(--b1); }
.qp-template.active { border-color: var(--b1); box-shadow: inset 0 0 0 1px var(--b1); background: color-mix(in srgb, var(--b1) 8%, var(--ui-surface)); }
.qp-template span { display: block; margin-bottom: 7px; font-size: 20px; }
.qp-template strong { display: block; font: 600 13px/1.25 var(--font-body); }
.qp-template small { display: block; margin-top: 4px; color: var(--ui-text2); font-size: 10px; }

.qp-form { display: grid; gap: 13px; margin-top: 13px; }
.qp-row { align-items: flex-start; gap: 10px; }
.qp-row > * { flex: 1; min-width: 0; }
.qp-field { display: grid; gap: 5px; min-width: 0; }
.qp-field label { color: var(--ui-text2); font-size: 10.5px; font-weight: 800; letter-spacing: .45px; text-transform: uppercase; }
.qp-field input,
.qp-field select,
.qp-field textarea {
  width: 100%;
  min-height: 39px;
  border: 1px solid var(--ui-border);
  border-radius: 7px;
  padding: 8px 10px;
  background: var(--ui-surface2);
  color: var(--ui-text);
  font: 500 13px/1.25 var(--font-body);
}
.qp-field textarea { min-height: 62px; resize: vertical; }
.qp-hint { margin: 0; font-size: 11px; line-height: 1.4; color: var(--ui-text2); }
.qp-crop button { border: 1px solid var(--ui-border); padding: 6px; background: var(--ui-surface2); color: var(--ui-text); border-radius: 5px; cursor: pointer; font: 600 11px var(--font-body); }
.qp-scorer output { color: var(--b1); font-weight: 900; }
.qp-crop { display: grid; gap: 4px; }
.qp-crop label { display: flex; justify-content: space-between; }
.qp-crop input[type="range"] { padding: 0; min-height: 22px; }
.qp-field input:focus,
.qp-field select:focus,
.qp-field textarea:focus { outline: 2px solid color-mix(in srgb, var(--b1) 28%, transparent); border-color: var(--b1); }

.qp-upload {
  min-height: 78px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--ui-border2);
  border-radius: 8px;
  background: var(--ui-surface2);
  color: var(--ui-text2);
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  font-size: 12px;
}
.qp-upload input { display: none; }
.qp-upload img { width: 100%; height: 112px; display: block; object-fit: contain; }

.qp-export-bar { gap: 9px; margin-top: 20px; }
.qp-export {
  flex: 1;
  min-height: 44px;
  border: 1px solid var(--ui-border2);
  border-radius: 8px;
  background: var(--ui-surface2);
  color: var(--ui-text);
  font-weight: 800;
  cursor: pointer;
}
.qp-export.primary { border-color: var(--b1); background: var(--b1); color: #fff; }
.qp-export:disabled { opacity: .55; cursor: wait; }
.qp-photoshop-bar { margin-top: 10px; padding: 10px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface2); }
.qp-photoshop-bar > span { display: block; margin-bottom: 7px; color: var(--ui-text2); font-size: 10px; text-align: center; }
.qp-photoshop-bar > div { display: flex; gap: 8px; }
.qp-photoshop-bar .qp-export { min-height: 36px; font-size: 11px; }
.qp-status { min-height: 18px; margin-top: 9px; color: var(--ui-text2); font-size: 11px; text-align: center; }
.qp-status.error { color: #b42318; }
.qp-status.success { color: #157347; }

.qp-preview { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); background: #e9ece9; }
.qp-preview-head { justify-content: space-between; gap: 20px; padding: 13px 20px; border-bottom: 1px solid var(--ui-border); background: var(--ui-surface); }
.qp-preview-head strong { display: block; font: 600 15px/1.25 var(--font-body); }
.qp-preview-head span { display: block; margin-top: 3px; color: var(--ui-text2); font-size: 10.5px; }
.qp-preview-head a { color: var(--b1); font-size: 11px; font-weight: 700; text-decoration: none; }
.qp-frame-wrap { min-height:0;position:relative;padding:24px;overflow:hidden;touch-action:pan-y; }
.qp-frame-wrap iframe {
  position:absolute;left:50%;top:50%;transform:translate(calc(-50% + var(--qp-pan-x,0px)),calc(-50% + var(--qp-pan-y,0px)));
  width:var(--qp-preview-size,min(72vh,720px));height:var(--qp-preview-size,min(72vh,720px));
  aspect-ratio: 1;
  border: 0;
  background: #fff;
  box-shadow: 0 18px 54px rgba(16,36,26,.22);
}
.qp-preview-tools { display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end; }
.qp-preview-tools label { white-space:nowrap;font-size:11px; }
#qpPreviewZoom { width:110px;min-height:32px; }
.qp-preview-tools .qp-step { margin:0;white-space:nowrap; }
#qpPreviewReset { min-height:36px;padding:6px 9px;border:1px solid var(--ui-border);border-radius:7px;background:var(--ui-surface2);color:var(--ui-text);font:600 11px var(--font-body);cursor:pointer; }
#qpPreviewReset:focus-visible { outline:2px solid var(--b1);outline-offset:2px; }
.qp-frame-wrap[data-pan-enabled="1"] { cursor:grab;touch-action:none; }
.qp-frame-wrap[data-dragging="1"] { cursor:grabbing; }

@media (max-width: 900px) {
  .qp-body { overflow: auto; }
  .qp-shell { height: auto; grid-template-columns: 1fr; }
  .qp-controls { border-right: 0; border-bottom: 1px solid var(--ui-border); }
  .qp-preview { min-height:0;grid-template-rows:auto auto auto; }
  .qp-frame-wrap { width:100%;aspect-ratio:1; }
  .qp-preview .qp-output { padding:0 16px 16px;background:var(--ui-surface); }
  .qp-preview .qp-export-bar { margin-top:16px; }
  .qp-body .tnav-wrap { max-width:100%;overflow-x:auto; }
  .qp-body .topbar #topbarClubName { max-width:150px; }
}

@media (max-width: 520px) {
  .qp-controls { padding: 16px; }
  .qp-template-grid { grid-template-columns: 1fr; }
  .qp-template span { display: inline; margin-right: 7px; }
  .qp-row { display: grid; }
  .qp-row.qp-score-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .qp-score-row input { min-height:40px; }
  .qp-preview-head { align-items: flex-start; }
  .qp-preview-head { padding:10px 12px;gap:8px;flex-wrap:wrap; }
  .qp-preview-tools { gap:8px;justify-content:flex-start; }
  #qpPreviewZoom { width:90px; }
  .qp-body .topbar { gap:8px; }
  .qp-preview-head a { display: none; }
  .qp-frame-wrap { padding: 12px; }
}
