.completion-review-page .review-summary-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.completion-review-page .review-summary-card { padding: 16px 18px; }
.completion-review-page .review-summary-card small { display: block; color: #718096; margin-bottom: 6px; }
.completion-review-page .review-summary-card strong { font-size: 22px; color: #20364a; }
.review-filter { max-width: 760px; }
.review-actions { display: flex; gap: 6px; align-items: center; }
.review-status { white-space: nowrap; }
.review-status.status-completion_submitted { background: #fff3cd; color: #7a5b00; }
.review-status.status-approved { background: #dff5e5; color: #176b37; }
.review-status.status-supplement_requested { background: #e7f0ff; color: #245e9b; }
.review-status.status-rework { background: #fde6e6; color: #9b2c2c; }
.completion-review-dialog { width: min(1040px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: 14px; overflow: hidden; }
.completion-review-dialog::backdrop { background: rgba(15, 28, 40, .48); }
.completion-review-shell { max-height: calc(100vh - 32px); overflow: auto; background: #fff; }
.completion-review-heading { position: sticky; top: 0; z-index: 4; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 18px 22px; border-bottom: 1px solid #e4e9ee; background: #fff; }
.completion-review-heading h2 { margin: 0; font-size: 20px; }
.completion-review-body { padding: 20px 22px 26px; }
.review-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.review-overview-item { padding: 12px; border: 1px solid #e3e8ed; border-radius: 10px; background: #f8fafb; min-width: 0; }
.review-overview-item.span-2 { grid-column: span 2; }
.review-overview-item small { display: block; color: #718096; font-size: 11px; margin-bottom: 4px; }
.review-overview-item strong { display: block; font-size: 13px; color: #263b4d; overflow-wrap: anywhere; }
.review-section { margin-top: 18px; padding-top: 16px; border-top: 1px solid #e3e8ed; }
.review-section h3 { margin: 0 0 10px; font-size: 15px; }
.review-text-box { padding: 13px 14px; border-radius: 10px; background: #f7f9fb; color: #31485b; white-space: pre-wrap; overflow-wrap: anywhere; }
.review-meta-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.review-meta-grid > div { padding: 12px; border: 1px solid #e5e9ed; border-radius: 9px; }
.review-meta-grid small { display: block; margin-bottom: 4px; color: #718096; }
.review-photo-group { margin-top: 14px; }
.review-photo-group h4 { margin: 0 0 8px; font-size: 13px; color: #334d61; }
.review-photo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.review-photo-card { position: relative; display: block; min-width: 0; border: 1px solid #dfe5ea; border-radius: 10px; overflow: hidden; background: #f2f5f7; color: inherit; text-decoration: none; }
.review-photo-card img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #e9edf0; }
.review-photo-card .review-photo-loading { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; color: #718096; font-size: 12px; }
.review-photo-card span { display: block; padding: 7px 8px; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.review-photo-card em { position: absolute; top: 6px; right: 6px; padding: 3px 6px; border-radius: 999px; background: rgba(24, 53, 76, .86); color: #fff; font-size: 10px; font-style: normal; }
.review-history { display: grid; gap: 7px; }
.review-history-row { display: grid; grid-template-columns: 58px 120px 1fr; gap: 10px; align-items: start; padding: 9px 0; border-bottom: 1px solid #edf0f2; font-size: 12px; }
.review-history-row time, .review-history-row small { color: #718096; }
.review-decision-box { margin-top: 20px; padding: 16px; border: 1px solid #dce4ea; border-radius: 12px; background: #fbfcfd; }
.review-decision-box label { display: block; font-weight: 600; color: #31495d; }
.review-decision-box textarea { width: 100%; min-height: 86px; margin-top: 7px; resize: vertical; }
.review-decision-help { margin: 7px 0 0; color: #718096; font-size: 12px; }
.review-decision-error { min-height: 18px; margin: 8px 0 0; color: #c53030; font-size: 12px; }
.review-decision-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.review-decision-actions .review-approve { background: #24734a; }
.review-decision-actions .review-supplement { background: #356fa8; }
.review-decision-actions .review-rework { background: #a24646; }
.review-readonly-note { padding: 12px 14px; border-radius: 10px; background: #f5f7f9; color: #526779; }
.review-empty { padding: 30px 16px; text-align: center; color: #718096; }

@media (max-width: 900px) {
  .completion-review-page .review-summary-cards { grid-template-columns: 1fr; }
  .review-overview { grid-template-columns: 1fr 1fr; }
  .review-overview-item.span-2 { grid-column: span 2; }
  .review-meta-grid { grid-template-columns: 1fr; }
  .review-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-history-row { grid-template-columns: 52px 1fr; }
  .review-history-row > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .completion-review-dialog { width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
  .completion-review-shell { max-height: 100vh; }
  .completion-review-heading { padding: 15px 16px; }
  .completion-review-body { padding: 16px; }
  .review-overview { grid-template-columns: 1fr; }
  .review-overview-item.span-2 { grid-column: span 1; }
  .review-photo-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
  .review-decision-actions { display: grid; grid-template-columns: 1fr; }
}


.review-location-evidence {
  margin: 14px 0;
  padding: 14px;
  border: 2px solid #d9e2ec;
  border-radius: 10px;
  background: #f8fafc;
}

.review-location-evidence > h4 {
  margin: 0 0 12px;
  color: #102a43;
  font-size: 16px;
}

.review-location-evidence .review-photo-group h5 {
  margin: 12px 0 8px;
  color: #475467;
  font-size: 13px;
}
.review-photo-viewer{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;background:#101820;color:#fff}
.review-photo-viewer header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#20364a}
.review-viewer-title,.review-viewer-count{display:block}
.review-viewer-title{font-size:15px}
.review-viewer-count{margin-top:4px;color:#cbd5df;font-size:12px}
.review-photo-viewer button{flex:none;border:0;background:transparent;color:#fff;font-size:32px;cursor:pointer}
.review-photo-viewer button:disabled{opacity:.3}
.review-photo-viewer main{display:flex;align-items:center;justify-content:space-between;flex:1;min-height:0}
.review-photo-viewer main img{max-width:calc(100% - 90px);max-height:100%;object-fit:contain}
.review-photo-viewer main button{width:44px;align-self:stretch}
.review-photo-viewer main{overflow:hidden}
.review-photo-viewer main img{touch-action:none;transform-origin:center center}
.review-viewer-zoom{display:flex;align-items:center;gap:4px;margin-left:auto}
.review-viewer-zoom button{min-width:40px;height:40px;border:1px solid #708398;border-radius:6px;font-size:23px}
.review-viewer-zoom [data-zoom-reset]{min-width:62px;font-size:13px}
@media(max-width:560px){
  .review-photo-viewer header{gap:8px}
  .review-viewer-title{font-size:12px;line-height:1.35}
  .review-viewer-zoom{gap:2px}
  .review-viewer-zoom button{min-width:32px;height:34px;font-size:20px}
  .review-viewer-zoom [data-zoom-reset]{min-width:48px;font-size:11px}
}
.review-photo-viewer header{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 38px;
  align-items:center;
  gap:8px;
}
.review-photo-viewer header>div{min-width:0}
.review-photo-viewer header .review-viewer-title{overflow-wrap:anywhere}
.review-photo-viewer header .review-viewer-zoom{
  display:flex;
  flex:none;
  gap:4px;
  margin:0;
}
.review-photo-viewer header .review-viewer-zoom button{
  flex:0 0 34px;
  width:34px;
  min-width:34px;
  padding:0;
}
.review-photo-viewer header .review-viewer-zoom [data-zoom-reset]{
  flex-basis:48px;
  width:48px;
  min-width:48px;
}
.review-photo-viewer header>[data-viewer-close]{
  flex:none;
  width:38px;
  min-width:38px;
  padding:0;
}
@media(max-width:560px){
  .review-photo-viewer header{grid-template-columns:minmax(0,1fr) auto 34px}
  .review-photo-viewer header .review-viewer-zoom button{
    flex-basis:30px;width:30px;min-width:30px;
  }
  .review-photo-viewer header .review-viewer-zoom [data-zoom-reset]{
    flex-basis:44px;width:44px;min-width:44px;
  }
  .review-photo-viewer header>[data-viewer-close]{
    width:34px;min-width:34px;
  }
}

/* Keep zoom controls centered independently of the title and close button. */
.review-photo-viewer header{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:12px 16px}
.review-photo-viewer header>div:first-child{min-width:0;padding-right:48px}
.review-photo-viewer header .review-viewer-zoom{grid-column:1;justify-self:center;margin:0}
.review-photo-viewer header>[data-viewer-close]{position:absolute;top:12px;right:16px;width:38px;min-width:38px;height:38px}
@media(max-width:560px){.review-photo-viewer header{grid-template-columns:minmax(0,1fr)}.review-photo-viewer header>[data-viewer-close]{width:34px;min-width:34px;height:34px}}

.review-photo-viewer main{position:relative}
.review-photo-viewer main>.review-viewer-title{position:absolute;top:12px;right:16px;z-index:1;max-width:min(75%,420px);padding:7px 10px;border-radius:6px;background:rgba(16,24,32,.82);color:#fff;font-size:13px;line-height:1.35;text-align:right;pointer-events:none}
.review-photo-viewer header .review-viewer-zoom button{display:grid;place-items:center;text-align:center;line-height:1;padding:0}
.review-photo-viewer header .review-viewer-zoom [data-zoom-reset]{font-size:13px}

/* Title shares the close bar; zoom controls sit at the image area's top right. */
.review-photo-viewer header{display:flex;align-items:center;justify-content:space-between;position:relative;gap:12px;min-height:72px;padding:12px 58px 12px 16px}
.review-photo-viewer header>div:first-child{min-width:0;padding-right:0}
.review-photo-viewer header .review-viewer-title{display:block;position:static;max-width:none;padding:0;background:none;text-align:left;overflow-wrap:anywhere;font-size:15px}
.review-photo-viewer header>[data-viewer-close]{position:absolute;right:16px;top:12px;width:38px;height:38px}
.review-photo-viewer main{position:relative}
.review-photo-viewer main .review-viewer-zoom{position:absolute;top:12px;right:12px;z-index:2;display:flex;gap:4px;margin:0;padding:4px;border-radius:7px;background:rgba(16,24,32,.82)}
.review-photo-viewer main .review-viewer-zoom button{display:grid;place-items:center;align-self:center;flex:0 0 34px;width:34px;min-width:34px;height:34px;padding:0;text-align:center;line-height:1;font-size:22px}
.review-photo-viewer main .review-viewer-zoom [data-zoom-reset]{flex-basis:48px;width:48px;min-width:48px;font-size:13px}
@media(max-width:560px){.review-photo-viewer header{display:flex;min-height:70px;padding-right:54px}.review-photo-viewer header .review-viewer-title{font-size:13px;line-height:1.3}.review-photo-viewer header>[data-viewer-close]{width:34px;height:34px}}

/* Desktop photo viewer interaction */
@media (hover: hover) and (pointer: fine) {
  .review-photo-viewer main img {
    user-select: none;
    -webkit-user-drag: none;
  }
  .review-photo-viewer main img.is-zoomed {
    cursor: grab;
  }
  .review-photo-viewer main img.is-dragging {
    cursor: grabbing;
  }
  .review-viewer-pc-help {
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 8px;
    color: #d6e0e8;
    font-size: 11px;
    line-height: 1;
    white-space: nowrap;
  }
}
@media (hover: none), (pointer: coarse), (max-width: 900px) {
  .review-viewer-pc-help { display: none !important; }
}


/* Mobile photo viewer full-width image */
@media (max-width: 560px) {
  .review-photo-viewer main {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    overflow: hidden;
  }

  .review-photo-viewer main img {
    display: block;
    width: 100%;
    max-width: none;
    max-height: 100%;
    object-fit: contain;
  }

  .review-photo-viewer main > button {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 3;
    width: 48px;
    height: auto;
    padding: 0;
    background: transparent;
  }

  .review-photo-viewer main > button:first-of-type {
    left: 0;
  }

  .review-photo-viewer main > button:last-of-type {
    right: 0;
  }

  .review-photo-viewer main .review-viewer-zoom {
    right: 8px;
    z-index: 5;
  }
}
