/* S1 Photos (MVP 6) additions on top of the shared S1 app.css */
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.who button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:var(--r2);padding:12px;cursor:pointer;font:inherit}.who button span{display:block;color:var(--text-3);font-size:12px}
.psteps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r3);background:#fff;margin:4px 0 16px;overflow:hidden}
.psteps>div{padding:10px 12px;border-right:1px solid var(--line);font-size:12.5px;color:var(--text-3)}.psteps>div:last-child{border-right:0}
.psteps b{display:flex;gap:7px;align-items:center;font-weight:550;color:var(--text-2);margin-bottom:2px}.psteps .n{width:20px;height:20px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-size:11px;flex:none}
.psteps .done b{color:var(--ink)}.psteps .done .n{color:var(--ok);border-color:#cdebd9;background:var(--ok-soft)}.psteps .now{background:var(--accent-soft)}.psteps .now b{color:var(--accent-2)}.psteps .now .n{border-color:var(--accent-line);color:var(--accent-2)}
.pcols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}.pcols>.right{position:sticky;top:72px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.ph{background:#fff;border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;box-shadow:var(--sh1);display:flex;flex-direction:column}
.ph .im{position:relative;aspect-ratio:3/2;background:var(--sunk);overflow:hidden;cursor:pointer}.ph .im img{width:100%;height:100%;object-fit:cover;display:block}.ph.plan .im img{object-fit:contain;background:#fff}
.ph .no{position:absolute;left:8px;top:8px;background:rgba(255,255,255,.92);border-radius:20px;font-size:11.5px;padding:1px 8px;color:var(--ink);font-weight:550}
.blabel{position:absolute;left:8px;bottom:8px;background:rgba(20,20,24,.72);color:#fff;border-radius:4px;font-size:11px;padding:2px 7px}
.ph .tx{padding:9px 11px;font-size:12.5px;flex:1}.ph .tx b{display:block;color:var(--ink);font-weight:550}.ph .tx span{color:var(--text-3)}
.ph .ac{display:flex;gap:4px;padding:0 8px 9px;flex-wrap:wrap}.ph .ac .btn{padding:3px 8px;min-height:26px;font-size:11.5px}
.twl{filter:brightness(.62) saturate(1.3) sepia(.22) hue-rotate(-8deg) contrast(1.06)}
.twl-wrap{position:relative}.twl-wrap::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,38,92,.45),rgba(255,170,90,.08) 70%);pointer-events:none}
.cmp{position:relative;border-radius:var(--r2);overflow:hidden;background:var(--sunk);user-select:none}.cmp img{display:block;width:100%}.cmp .after{position:absolute;inset:0;overflow:hidden}.cmp .after img{position:absolute;left:0;top:0;height:100%;width:auto;max-width:none}
.cmp .cap{position:absolute;top:8px;font-size:11px;background:rgba(255,255,255,.9);border-radius:20px;padding:1px 8px}.cmp .cap.l{left:8px}.cmp .cap.r{right:8px}
.cmp .bar{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
input[type=range].slide{width:100%;margin:8px 0 2px}
.ed{border-top:1px solid var(--line);padding:10px 0;display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center}.ed b{color:var(--ink);font-weight:550}.ed .small{grid-column:1/-1}
.dlg{position:fixed;inset:0;background:rgba(20,20,24,.35);z-index:50;display:grid;place-items:center;padding:16px}.dlg .box{width:min(980px,100%);max-height:92vh;overflow:auto}
.dlg .dg{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px}
.outl{display:flex;gap:8px;flex-wrap:wrap}.outl .ph{width:170px}
@media (max-width:1180px){.pcols{grid-template-columns:1fr}.pcols>.right{position:static}.psteps{grid-template-columns:repeat(3,minmax(0,1fr))}.psteps>div:nth-child(3){border-right:0}.psteps>div:nth-child(-n+3){border-bottom:1px solid var(--line)}}
@media (max-width:760px){.grid{grid-template-columns:1fr 1fr;gap:8px}.ph .tx span{display:none}.dlg .dg{grid-template-columns:1fr}.psteps{grid-template-columns:1fr 1fr}.psteps>div{border-right:0!important;border-bottom:1px solid var(--line)}.psteps>div:nth-child(odd){border-right:1px solid var(--line)!important}.who{grid-template-columns:1fr}}