/* Instagram look-alike screens (.igp). Not affiliated with Instagram. Controls live in pvcore.css. */
.igp { --bg: #fff; --fg: #000; --fg2: #737373; --line: #dbdbdb; --soft: #efefef; --blue: #0095f6;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: var(--bg); color: var(--fg); text-align: left; position: relative; -webkit-font-smoothing: antialiased; line-height: 1.3; font-size: 14px; }
.igp.dark { --bg: #000; --fg: #f5f5f5; --fg2: #a8a8a8; --line: #262626; --soft: #262626; }
.igp * { box-sizing: border-box; margin: 0; padding: 0; }
.igp svg { display: block; flex: none; }
.igp.hi .mine .pic { box-shadow: 0 0 0 3px #ff3d3d; }
.igp .av { border-radius: 50%; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; flex: none; }
.igp .ring { padding: 2px; border-radius: 50%; background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888); display: flex; flex: none; }
.igp .ring .in { padding: 2px; border-radius: 50%; background: var(--bg); display: flex; }
.igp .ring.seen { background: var(--line); }
.igp .bar { height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid var(--line); font-weight: 700; font-size: 20px; }
.igp .bar .ic { display: flex; gap: 18px; }
.igp .stories { display: flex; gap: 14px; padding: 12px 12px 10px; overflow: hidden; }
.igp .stories .s { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 12px; width: 66px; flex: none; color: var(--fg); white-space: nowrap; }
.igp .stories .s span { max-width: 66px; overflow: hidden; text-overflow: ellipsis; }
.igp .post { padding-bottom: 6px; }
.igp .post .hd { display: flex; align-items: center; gap: 10px; padding: 8px 12px; }
.igp .post .hd .nm { font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 4px; }
.igp .post .hd .loc { font-size: 12px; color: var(--fg); }
.igp .post .hd .dots { margin-left: auto; }
.igp .pic { position: relative; overflow: hidden; background: #222; }
.igp .pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.igp .pic .pill { position: absolute; top: 12px; right: 12px; background: rgba(26, 26, 26, .8); color: #fff; font-size: 12px; padding: 4px 10px; border-radius: 12px; }
.igp .act { display: flex; align-items: center; gap: 16px; padding: 10px 12px 6px; }
.igp .act .sp { margin-left: auto; }
.igp .dotsrow { display: flex; justify-content: center; gap: 4px; padding-top: 2px; }
.igp .dotsrow i { width: 6px; height: 6px; border-radius: 50%; background: var(--line); }
.igp .dotsrow i.on { background: var(--blue); }
.igp .txt { padding: 0 12px; }
.igp .lk { font-weight: 600; margin-bottom: 6px; }
.igp .cp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
.igp .cp b { font-weight: 600; margin-right: 4px; }
.igp .more { color: var(--fg2); }
.igp .cm, .igp .tm { color: var(--fg2); margin-top: 6px; }
.igp .tm { font-size: 10px; text-transform: uppercase; letter-spacing: .2px; }
.igp .vf { width: 12px; height: 12px; fill: #0095f6; }
/* profile */
.igp .prof { padding: 16px 16px 8px; }
.igp .prof .top { display: flex; align-items: center; gap: 24px; }
.igp .prof .stats { display: flex; justify-content: space-around; flex: 1; text-align: center; }
.igp .prof .stats b { display: block; font-size: 16px; font-weight: 600; }
.igp .prof .stats span { font-size: 13px; }
.igp .prof .name { font-weight: 600; margin-top: 12px; }
.igp .prof .bio { margin-top: 2px; white-space: pre-line; }
.igp .prof .btns { display: flex; gap: 8px; margin-top: 12px; }
.igp .prof .btns div { flex: 1; text-align: center; background: var(--soft); border-radius: 8px; padding: 7px 0; font-weight: 600; font-size: 14px; }
.igp .prof .btns div.f { background: var(--blue); color: #fff; }
.igp .ptabs { display: flex; border-top: 1px solid var(--line); margin-top: 8px; }
.igp .ptabs div { flex: 1; display: flex; justify-content: center; padding: 12px 0; border-top: 1px solid transparent; margin-top: -1px; }
.igp .ptabs div.on { border-top-color: var(--fg); }
.igp .tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.igp .tile { position: relative; overflow: hidden; background: #222; }
.igp .tile img { width: 100%; height: 100%; object-fit: cover; display: block; }
.igp .tile.mine { box-shadow: inset 0 0 0 0 transparent; }
.igp.hi .tile.mine::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 3px #ff3d3d; }
.igp .tile .ci { position: absolute; top: 6px; right: 6px; color: #fff; }
/* desktop */
.igp .dsk { display: flex; min-height: 100%; }
.igp .rail { width: 220px; flex: none; border-right: 1px solid var(--line); padding: 20px 12px; display: flex; flex-direction: column; gap: 4px; }
.igp .rail .lg { font: 700 22px/1 -apple-system, "Segoe UI", sans-serif; padding: 12px 12px 24px; }
.igp .rail .it { display: flex; align-items: center; gap: 16px; padding: 12px; border-radius: 8px; font-size: 16px; }
.igp .rail .it.on { font-weight: 700; }
.igp .feedc { flex: 1; display: flex; justify-content: center; gap: 64px; padding: 24px 24px; }
.igp .col { width: 470px; }
.igp .col .post { border-bottom: 1px solid var(--line); margin-bottom: 20px; padding-bottom: 12px; }
.igp .col .post .hd { padding-left: 0; padding-right: 0; }
.igp .col .post .pic { border-radius: 4px; border: 1px solid var(--line); }
.igp .col .post .act, .igp .col .post .txt { padding-left: 0; padding-right: 0; }
.igp .sug { width: 300px; padding-top: 24px; }
.igp .sug .r { display: flex; align-items: center; gap: 12px; margin: 14px 0; }
.igp .sug .r .t { flex: 1; min-width: 0; }
.igp .sug .r .t b { display: block; font-weight: 600; font-size: 14px; }
.igp .sug .r .t span { font-size: 12px; color: var(--fg2); }
.igp .sug .r a { color: var(--blue); font-weight: 600; font-size: 12px; }
/* modal */
.igp .modalbg { background: rgba(0, 0, 0, .65); padding: 40px; display: flex; justify-content: center; }
.igp .modal { display: flex; background: var(--bg); border-radius: 4px; overflow: hidden; }
.igp .modal .pic { flex: none; border-radius: 0; }
.igp .modal .side { width: 380px; display: flex; flex-direction: column; border-left: 1px solid var(--line); }
.igp .modal .side .hd { padding: 14px 16px; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 12px; }
.igp .modal .side .cmts { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 16px; overflow: hidden; }
.igp .modal .side .cmts .c { display: flex; gap: 12px; }
.igp .modal .side .meta { border-top: 1px solid var(--line); padding: 4px 16px 10px; }
.igp .modal .side .add { border-top: 1px solid var(--line); padding: 14px 16px; color: var(--fg2); display: flex; justify-content: space-between; }
/* crops */
.igp .crops { padding: 24px; display: flex; flex-direction: column; gap: 28px; }
.igp .crops .row { display: flex; gap: 22px; flex-wrap: wrap; align-items: flex-end; }
.igp .crops .cr .pic { border-radius: 4px; }
.igp .crops .cr .lb { font-size: 12px; color: var(--fg2); margin-top: 6px; width: 150px; }
.igp .crops .t { font-weight: 600; margin-bottom: 10px; }
/* explore */
.igp .expl { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 129px; gap: 2px; }
.igp .expl .tile.big { grid-column: span 2; grid-row: span 2; }