/* PhotoTools standalone specification centers.
 * Product rhythm intentionally mirrors the regular tool pages:
 * one 1320px editorial axis for title, query workspace and footer.
 * Query/reference pages remain distinct from editor workspaces while reusing the
 * same PhotoTools canvas, surface, border, radius, icon and accent tokens.
 */
.spec-center-shell{
  box-sizing:border-box;
  width:100%;
  margin:0;
  color:var(--pts-ink);
}
/* The title area is the regular PhotoTools workspace-titlebar component.
 * Keep only query-page structural helpers here; typography, colors, widths and
 * responsive title scale come from the shared .workspace-titlebar/.breadcrumbs/
 * .workspace-kicker rules in pts-design.css. */
.spec-center-titlebar{box-sizing:border-box}
.spec-center-workspace{
  box-sizing:border-box;
  width:min(1320px,calc(100% - 60px));
  max-width:1320px;
  margin:14px auto 0;
  padding:18px;
  border:1px solid var(--pts-line);
  border-radius:14px;
  background:var(--pts-canvas-2);
  box-shadow:none;
}
.spec-center-breadcrumbs{display:flex;align-items:center;gap:8px;margin:0}
.spec-center-heading{display:block;margin:0}
/* pts-design.css owns kicker type/color; these two layout declarations mirror
 * the shared workspace geometry because query pages intentionally do not load
 * editor workspace.css. */
.spec-center-kicker{display:flex;align-items:center;gap:8px;font-weight:760;line-height:1.25}
.spec-center-kicker i{display:block;flex:0 0 4px;width:4px;height:4px;border-radius:50%}
.spec-center-heading h1{line-height:1.14}
.spec-center-heading p{max-width:850px;margin:0;line-height:1.62}

.spec-center-section,.spec-center-result,.spec-center-source{
  border:1px solid var(--pts-line);
  border-radius:14px;
  background:var(--pts-canvas);
  box-shadow:none;
}
.spec-center-section{margin:0;padding:20px}
.spec-center-common,.spec-center-platforms,.spec-center-finder{
  border:0;
  border-radius:0;
  background:transparent;
}
.spec-center-query-grid{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
  gap:24px;
  align-items:start;
  padding-bottom:18px;
  border-bottom:1px solid var(--pts-line);
}
.spec-center-common,.spec-center-platforms{padding:2px 0}
.spec-center-finder{padding:2px 0 2px 24px;border-left:1px solid var(--pts-line)}
.spec-center-shell[data-kind="social"] .spec-center-query-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.spec-center-section__head{display:block;margin-bottom:14px}
.spec-center-section__head span,.spec-center-result__head span,.spec-center-source__head span{display:block;margin-bottom:2px;color:var(--pts-accent);font-size:11px;font-weight:760;letter-spacing:.06em}
.spec-center-section__head h2,.spec-center-result__head h2,.spec-center-source__head h2{margin:0;color:var(--pts-ink);font-size:17px;line-height:1.62;letter-spacing:normal}
.spec-center-section__note{display:block;max-width:620px;margin:3px 0 0;color:var(--pts-muted);font-size:14px;line-height:1.62}

.spec-center-shortcuts{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px}
.spec-center-shortcut{display:flex;align-items:center;gap:11px;min-width:154px;min-height:74px;padding:12px 14px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--pts-ink);text-align:left;box-shadow:none;transition:border-color .16s ease,background .16s ease,transform .16s ease}
.spec-center-shortcut:hover{transform:translateY(-1px)}
.spec-center-shortcut:hover{border-color:var(--pts-line);background:var(--pts-surface-soft)}
.spec-center-shortcut.is-active{border-color:var(--pts-accent);background:var(--pts-accent-soft)}
.spec-center-shortcut__icon,.spec-center-platform__icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid var(--pts-line);border-radius:10px;background:var(--pts-canvas-2);color:var(--pts-accent)}
.spec-center-shortcut__icon .pts-system-icon,.spec-center-platform__icon .pts-system-icon{width:30px;height:30px}
.spec-center-shortcut__icon .pts-system-icon__frame,.spec-center-platform__icon .pts-system-icon__frame{stroke:var(--pts-line-2)}
.spec-center-shortcut>span:last-child{display:grid;min-width:0;gap:2px}
.spec-center-common__more{display:flex;align-items:center;margin-top:10px}
.spec-center-view-all{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 11px;border:1px solid var(--pts-line);border-radius:9px;background:transparent;color:var(--pts-ink-2);font-size:13px;font-weight:760;box-shadow:none;transition:border-color .16s ease,background .16s ease}
.spec-center-view-all:hover{border-color:var(--pts-line-2);background:var(--pts-surface-soft)}
.spec-center-view-all__icon{display:grid;place-items:center;width:20px;height:20px;flex:0 0 20px;color:var(--pts-accent)}
.spec-center-view-all__icon .pts-system-icon{width:18px;height:18px}
.spec-center-view-all__icon .pts-system-icon__frame{stroke:var(--pts-line-2)}
.spec-center-shortcut strong{overflow:hidden;text-overflow:ellipsis;color:var(--pts-ink);font-size:15px;line-height:1.3;white-space:nowrap}
.spec-center-shortcut small{color:var(--pts-muted);font-size:12px}

.spec-center-platform-list{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px}
.spec-center-platform-list button{display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:142px;min-height:66px;padding:10px 8px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--pts-ink-2);font-weight:760;text-align:left;box-shadow:none;transition:border-color .16s ease,background .16s ease,transform .16s ease}
.spec-center-platform-list button:hover{transform:translateY(-1px)}
.spec-center-platform-list button:hover{border-color:var(--pts-line);background:var(--pts-canvas)}
.spec-center-platform-list button.is-active{border-color:var(--pts-accent);background:var(--pts-accent-soft);color:var(--pts-accent-strong)}
.spec-center-platform-list button.is-active .spec-center-platform__icon{border-color:var(--pts-accent);background:var(--pts-canvas-2)}
.spec-center-scenes{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;padding-top:13px;border-top:1px solid var(--pts-line)}
.spec-center-finder .spec-center-scenes{margin-top:0;margin-bottom:13px;padding-top:0;border-top:0}
.spec-center-finder .spec-center-scenes + .spec-center-search{margin-top:0}
.spec-center-scenes .filter-chip{border:1px solid var(--pts-line-2)!important;background:transparent!important;color:var(--pts-ink-2)!important;box-shadow:none!important;cursor:pointer}
.spec-center-scenes .filter-chip:hover{border-color:var(--pts-accent)!important;background:var(--pts-canvas)!important;color:var(--pts-ink)!important}
.spec-center-scenes .filter-chip:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(155,92,54,.12)!important}
.spec-center-scenes .filter-chip.is-active{border-color:var(--pts-accent)!important;background:var(--pts-accent-soft)!important;color:var(--pts-accent-strong)!important;box-shadow:inset 0 0 0 1px rgba(155,92,54,.04)!important}
.spec-center-scenes .filter-chip.is-active:hover{border-color:var(--pts-accent-strong)!important;background:var(--pts-accent-soft)!important;color:var(--pts-accent-strong)!important}
.spec-center-scene-note{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px;width:100%;margin-top:2px;padding:11px 13px;border:1px solid var(--pts-line);border-radius:10px;background:var(--pts-canvas);color:var(--pts-muted)}
.spec-center-scene-note>div{display:grid;gap:1px;min-width:150px}.spec-center-scene-note span{color:var(--pts-accent);font-size:10px;font-weight:760;letter-spacing:.05em}.spec-center-scene-note strong{color:var(--pts-ink-2);font-size:13px}.spec-center-scene-note strong b{font:inherit}.spec-center-scene-note p{margin:0;color:var(--pts-muted);font-size:12px;line-height:1.55}
.spec-center-search{display:flex;align-items:center;gap:10px;width:min(100%,620px);min-height:48px;padding:0 13px;border:1px solid #d0c7bd!important;border-radius:9px;background:#fffdfa!important;color:#211e1b!important;transition:border-color .16s ease,box-shadow .16s ease}
.spec-center-search:focus-within{border-color:#a97453;box-shadow:0 0 0 3px rgba(155,92,54,.10)}
.spec-center-search__icon{display:grid;place-items:center;width:22px;color:var(--pts-muted)}
.spec-center-search__icon svg{width:19px;height:19px}
.spec-center-search input{width:100%;min-width:0;height:44px;border:0;background:transparent;color:#211e1b;outline:0;font-size:15px}
.spec-center-search button{border:0;background:transparent;color:var(--pts-accent);font-size:12px;font-weight:800}
.spec-center-filter-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}

.spec-center-record-panel{margin-top:16px;padding-top:16px;border-top:1px solid var(--pts-line)}
.spec-center-record-panel[hidden]{display:none!important}
.spec-center-record-panel__head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px}
.spec-center-record-panel__head>span{color:var(--pts-muted);font-size:13px;line-height:1.5}
.spec-center-record-panel__head .filter-chip{flex:0 0 auto}
.spec-center-record-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:0}
.spec-center-record-list[hidden]{display:none!important}
.spec-center-finder--secondary .spec-center-section__head{margin-bottom:12px}
.spec-center-finder--secondary{padding-top:18px;padding-bottom:18px}
.spec-center-record-list button{display:grid;gap:3px;min-width:0;min-height:62px;padding:11px 12px;border:1px solid var(--pts-line);border-radius:10px;background:var(--pts-surface-soft);color:var(--pts-ink);text-align:left}
.spec-center-record-list button:hover{border-color:var(--pts-line-2);background:var(--pts-surface-soft)}
.spec-center-record-list button.is-active{border-color:var(--pts-accent);background:var(--pts-accent-soft);box-shadow:inset 3px 0 0 var(--pts-accent)}
.spec-center-record-list strong{overflow:hidden;text-overflow:ellipsis;font-size:13px;line-height:1.35;white-space:nowrap}
.spec-center-record-list small{color:var(--pts-muted);font-size:11px}
.spec-center-empty{grid-column:1/-1;padding:18px;border:1px dashed var(--pts-line-2);border-radius:10px;color:var(--pts-muted);text-align:center}

.spec-center-result-grid{display:grid;grid-template-columns:minmax(0,1.68fr) minmax(350px,.72fr);gap:14px;margin-top:18px;padding-top:0;border-top:0}
.spec-center-result,.spec-center-source{padding:22px;box-shadow:var(--shadow-soft)}
.spec-center-result{background:var(--pts-canvas);box-shadow:none}
.spec-center-source{position:relative;background:var(--pts-canvas);box-shadow:none}
.spec-center-source::before{content:"";position:absolute;inset:14px auto 14px 0;width:3px;border-radius:0 3px 3px 0;background:var(--pts-accent)}
.spec-center-result__head,.spec-center-source__head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:15px}
.spec-center-result__head b,.spec-center-source__head>b{flex:0 0 auto;padding:4px 8px;border:1px solid var(--pts-line);border-radius:999px;background:var(--pts-positive-soft);color:var(--pts-positive);font-size:10px;font-weight:850}
.spec-center-result__body{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center}
.spec-center-id-visual{position:relative;display:grid;place-items:center;min-height:292px;padding:18px 30px 30px;border:1px solid var(--pts-line);border-radius:13px;background:var(--pts-dark-2);border-color:var(--pts-dark-line)}
.spec-center-photo-frame{position:relative;width:174px;overflow:hidden;border:1px solid var(--pts-dark-line);border-radius:9px;background:var(--pts-canvas-2);box-shadow:var(--shadow-soft)}
.spec-center-photo-frame img{display:block;width:100%;aspect-ratio:25/35;object-fit:cover;object-position:center 19%}
.spec-center-dimension{position:absolute;color:var(--pts-paper);font-size:10px;font-weight:700}
.spec-center-dimension--h{left:3px;top:50%;transform:translateY(-50%) rotate(-90deg)}
.spec-center-dimension--w{bottom:4px;left:50%;transform:translateX(-50%)}
.spec-center-social-visual{display:grid;grid-template-rows:auto 1fr;place-items:center;min-height:292px;padding:18px;border:1px solid var(--pts-line);border-radius:13px;background:var(--pts-dark-2);border-color:var(--pts-dark-line);overflow:hidden}
.spec-center-social-label{justify-self:start;align-self:start;padding:4px 8px;border:1px solid var(--pts-dark-line);border-radius:999px;background:var(--pts-dark);color:var(--pts-paper);font-size:10px;font-weight:850}
.spec-center-ratio-box{display:grid;place-items:center;width:min(190px,var(--ratio-width,190px));height:auto;max-width:86%;aspect-ratio:var(--ratio-aspect,1);border:2px solid var(--pts-accent);border-radius:12px;background:var(--pts-dark);box-shadow:none}
.spec-center-ratio-box strong{color:var(--pts-paper);font-size:30px;letter-spacing:-.04em}
.spec-center-ratio-box small{color:var(--pts-paper);font-size:10px;opacity:.72}
.spec-center-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--pts-line);border-radius:11px;overflow:hidden;background:transparent}
.spec-center-facts>div{display:grid;align-content:start;gap:3px;min-height:74px;padding:11px 13px;border-right:1px solid var(--pts-line);border-bottom:1px solid var(--pts-line)}
.spec-center-facts>div:nth-child(2n){border-right:0}.spec-center-facts>div:nth-last-child(-n+2){border-bottom:0}
.spec-center-facts span{color:var(--pts-muted);font-size:12px}
.spec-center-facts strong{color:var(--pts-ink-2);font-size:14px;line-height:1.45}
.spec-center-facts small{color:var(--pts-muted);font-size:12px;line-height:1.45}
.spec-center-boundary{margin-top:14px;padding:10px 12px;border-left:3px solid var(--pts-line-2);border-radius:0 9px 9px 0;background:var(--pts-surface-soft);color:var(--pts-muted);font-size:12px;line-height:1.62}
.spec-center-actions{display:flex;gap:9px;margin-top:14px}
.spec-center-actions .button{min-height:50px;font-size:15px}
.spec-center-actions .button--secondary{border:1px solid var(--pts-line-2);background:var(--pts-surface);color:var(--pts-ink-2);box-shadow:none}

.spec-center-source__head{padding-bottom:12px;border-bottom:1px solid var(--pts-line)}
.spec-center-source__summary{display:grid;gap:8px}
.spec-center-source__summary>div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:9px;align-items:start}
.spec-center-source__summary span{color:var(--pts-muted);font-size:12px}
.spec-center-source__summary strong{min-width:0;color:var(--pts-ink-2);font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.spec-center-source__summary a{color:var(--pts-accent);text-decoration:underline;text-underline-offset:3px}
.spec-center-source__details{margin-top:13px;padding-top:11px;border-top:1px solid var(--pts-line)}
.spec-center-source__details summary{cursor:pointer;color:var(--pts-accent);font-size:12px;font-weight:760}
.spec-center-source-list{display:grid;gap:9px;margin-top:10px}
.spec-center-source-card{padding:11px;border:1px solid var(--pts-line);border-radius:10px;background:var(--pts-surface-soft)}
.spec-center-source-card>div{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}
.spec-center-source-card span{color:var(--pts-accent);font-size:11px;font-weight:760}
.spec-center-source-card b{color:var(--pts-positive);font-size:11px}
.spec-center-source-card strong{display:block;color:var(--pts-ink-2);font-size:13px;line-height:1.45}
.spec-center-source-card small{display:block;margin-top:4px;color:var(--pts-muted);font-size:12px;line-height:1.5}
.spec-center-source-card a{display:inline-block;margin-top:7px;color:var(--pts-accent);font-size:12px;font-weight:760}


@media(min-width:1101px){
  .spec-center-shell[data-kind="social"] .spec-center-platform-list{display:grid;grid-template-columns:repeat(3,max-content);gap:8px;justify-content:start}
}
@media(max-width:1100px) and (min-width:901px){
  .spec-center-query-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
  .spec-center-finder{padding-left:20px}
  .spec-center-shortcuts{display:grid;grid-template-columns:repeat(2,max-content);justify-content:start}
  .spec-center-platform-list{display:grid;grid-template-columns:repeat(3,max-content);gap:8px;justify-content:start}
  .spec-center-record-list{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .spec-center-query-grid,.spec-center-shell[data-kind="social"] .spec-center-query-grid{grid-template-columns:1fr;gap:0;padding-bottom:0;border-bottom:0}
  .spec-center-common,.spec-center-platforms{padding:2px 2px 18px}
  .spec-center-finder{padding:18px 2px;border-top:1px solid var(--pts-line);border-left:0}
  .spec-center-record-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spec-center-result-grid{margin-top:0;padding-top:18px;border-top:1px solid var(--pts-line)}
}
@media(max-width:1024px){
  .spec-center-result-grid{grid-template-columns:1fr}
  .spec-center-source{order:2}
}
@media(max-width:900px) and (min-width:781px){
  .spec-center-platform-list{display:grid;grid-template-columns:repeat(3,max-content);justify-content:start}
}
@media(max-width:780px){
  .spec-center-workspace{width:calc(100% - 32px);margin-top:11px;padding:12px;border-radius:18px}
  .spec-center-breadcrumbs{gap:5px;margin-bottom:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .spec-center-kicker{gap:6px}.spec-center-kicker i{width:3px;height:3px;flex-basis:3px}
  /* Mobile query-page title must stay pixel-identical to the shared PhotoTools workspace title.
   This is a parity guard, not a separate specification-center scale. */
  .spec-center-titlebar.workspace-titlebar h1{font-size:27px!important;line-height:1.08!important;letter-spacing:-.045em!important;color:var(--pts-ink)!important}
  .spec-center-heading p{display:-webkit-box;max-width:none;overflow:hidden;line-height:1.45;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .spec-center-section{padding:14px 2px}
  .spec-center-common,.spec-center-platforms{padding-top:2px;padding-bottom:14px}
  .spec-center-finder{padding-top:14px;padding-bottom:14px}
  .spec-center-section__head{margin-bottom:12px}.spec-center-section__head h2{font-size:15px}.spec-center-section__note{max-width:none;margin-top:3px;font-size:12px;line-height:1.62}
  .spec-center-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.spec-center-shortcut{min-height:68px;padding:9px 10px;gap:8px}.spec-center-shortcut__icon{width:38px;height:38px;flex-basis:38px}.spec-center-shortcut__icon .pts-system-icon{width:27px;height:27px}.spec-center-shortcut strong{white-space:normal;font-size:13px}.spec-center-shortcut small{font-size:10px}.spec-center-common__more{margin-top:8px}.spec-center-view-all{min-height:36px;font-size:13px}
  .spec-center-platform-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.spec-center-platform-list button{min-height:58px;padding:8px 9px;gap:8px}.spec-center-platform-list button:last-child:nth-child(odd){grid-column:1/-1}.spec-center-platform__icon{width:36px;height:36px;flex-basis:36px}.spec-center-platform__icon .pts-system-icon{width:26px;height:26px}
  .spec-center-search{width:100%;min-height:48px}.spec-center-search input{height:44px;font-size:14px}
  .spec-center-scene-note{grid-template-columns:1fr;gap:5px;padding:10px 11px}.spec-center-scene-note>div{min-width:0}
  .spec-center-filter-chips{flex-wrap:wrap;overflow:visible;padding-bottom:0}.spec-center-filter-chips button{flex:0 0 auto}
  .spec-center-record-list{grid-template-columns:1fr 1fr;gap:7px}.spec-center-record-list button{min-height:58px;padding:9px 10px}.spec-center-record-list strong{white-space:normal;font-size:12px}
  .spec-center-result-grid{gap:11px;margin-top:0;padding-top:14px}.spec-center-result,.spec-center-source{padding:15px;border-radius:14px}
  .spec-center-result__head,.spec-center-source__head{margin-bottom:12px}.spec-center-result__head h2,.spec-center-source__head h2{font-size:15px}
  .spec-center-result__body{grid-template-columns:1fr;gap:13px}.spec-center-id-visual{min-height:250px}.spec-center-photo-frame{width:154px}.spec-center-social-visual{min-height:245px}
  .spec-center-facts{grid-template-columns:1fr}.spec-center-facts>div{min-height:0;border-right:0}.spec-center-facts>div:nth-last-child(-n+2){border-bottom:1px solid var(--pts-line)}.spec-center-facts>div:last-child{border-bottom:0}
  .spec-center-actions{flex-direction:column}.spec-center-actions .button{width:100%;min-height:46px;font-size:14px}
  .spec-center-source__summary>div{grid-template-columns:70px minmax(0,1fr)}
}
@media(max-width:390px){
  .spec-center-record-list{grid-template-columns:1fr}
  .spec-center-platform-list{grid-template-columns:1fr 1fr}
}

/* Shared PhotoTools filter-chip geometry: specification centers must not invent a separate radius. */
.spec-center-filter-chips .filter-chip,.spec-center-scenes .filter-chip{border-radius:6px!important}

@media(max-width:780px){
  .spec-center-workspace{width:calc(100% - 32px);max-width:none;padding:14px}
}
@media(max-width:560px){
  .spec-center-record-list{grid-template-columns:1fr}
  .spec-center-record-panel__head{align-items:flex-start}
}

/* v1.4.0-rc.8: social-only secondary surfaces stay inside the PhotoTools canvas hierarchy. */
.spec-center-shell[data-kind="social"] .spec-center-boundary{background:var(--pts-canvas-2)}
.spec-center-shell[data-kind="social"] .spec-center-source-card{background:var(--pts-canvas-2)}

/* v1.4.3: standalone query tools reuse only the full-width tool ad placements.
 * Keep those ads on the same 1320px editorial axis as the query title/workspace;
 * rail/preview/panel placements remain exclusive to the three-column editor. */
.spec-center-shell>.managed-ad-slot{width:min(1320px,calc(100% - 60px));max-width:1320px;margin:18px auto}
@media(max-width:780px){.spec-center-shell>.managed-ad-slot{width:calc(100% - 32px);margin:14px auto}}
