.phone{--pw:min(68vw,280px);position:relative;width:var(--pw);aspect-ratio:9/19;border-radius:calc(var(--pw)*.16);background:#0f1426;padding:calc(var(--pw)*.035);box-shadow:0 30px 70px -30px rgba(15,20,38,.6),inset 0 0 0 2px #2a3150;font-size:calc(var(--pw)/22);flex:none}
.ph-isl{position:absolute;top:calc(var(--pw)*.06);left:50%;width:30%;height:calc(var(--pw)*.07);margin-left:-15%;background:#0f1426;border-radius:99px;z-index:5}
.ph-st{position:absolute;z-index:4;top:calc(var(--pw)*.065);left:calc(var(--pw)*.11);right:calc(var(--pw)*.11);display:flex;justify-content:space-between;font:600 .8em -apple-system,system-ui,sans-serif;color:#1a2140;letter-spacing:.02em}
.ph-scr{position:absolute;inset:calc(var(--pw)*.035);border-radius:calc(var(--pw)*.13);overflow:hidden;background:#fff8ef}
.ph-s{position:absolute;inset:0;padding:calc(var(--pw)*.2) calc(var(--pw)*.06) calc(var(--pw)*.2);display:flex;flex-direction:column;gap:.55em;opacity:0;transform:translateY(6%) scale(.97);transition:opacity .6s ease,transform .7s cubic-bezier(.22,.61,.36,1);color:#1a2140;text-align:left;font-family:-apple-system,"Helvetica Neue",system-ui,sans-serif}
.ph-s.on{opacity:1;transform:none}
.ph-tab{position:absolute;z-index:4;left:calc(var(--pw)*.035);right:calc(var(--pw)*.035);bottom:calc(var(--pw)*.035);height:calc(var(--pw)*.16);border-radius:0 0 calc(var(--pw)*.13) calc(var(--pw)*.13);background:rgba(255,255,255,.94);border-top:1px solid #efe3d2;display:flex;justify-content:space-around;align-items:center;font:600 .72em -apple-system,system-ui,sans-serif;color:#8a8c99}
.ph-tab .on{color:#1d2b53}
.ph-hd{display:flex;justify-content:space-between;align-items:center}.ph-hd b{font-size:1.35em;letter-spacing:-.02em}
.ph-pill{background:#ffe0cf;color:#c4512a;font-weight:700;font-size:.75em;padding:.3em .7em;border-radius:99px}
.ph-photo{position:relative;border-radius:1em;overflow:hidden;flex:1;min-height:0;background:#e9e2d6}
.ph-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block}
.ph-nm{position:absolute;left:.7em;bottom:.6em;color:#fff;font-weight:800;font-size:1.25em;text-shadow:0 1px 8px rgba(0,0,0,.45)}.ph-nm small{display:block;font-weight:500;font-size:.62em;opacity:.9}
.ph-prompt{background:#fff;border-radius:.9em;padding:.6em .8em;box-shadow:0 2px 10px rgba(29,43,83,.08)}.ph-prompt small{font-size:.72em;color:#6b6d7c;font-weight:600}.ph-prompt p{margin:.15em 0 0;font:600 1.12em/1.2 Georgia,"Times New Roman",serif}
.ph-chips{display:flex;gap:.35em;flex-wrap:wrap}.ph-chips span{font-size:.72em;font-weight:700;padding:.3em .7em;border-radius:99px;background:#fff;border:1px solid #ecdcc6}
.ph-cta{background:#ff8a5b;color:#fff;text-align:center;font-weight:800;padding:.75em;border-radius:99px;font-size:.92em}
.ph-match{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:.6em}
.ph-av2{position:relative;display:flex;margin-bottom:.4em}.ph-av2 img{width:5.2em;height:5.2em;border-radius:50%;object-fit:cover;object-position:50% 4%;border:3px solid #fff8ef;box-shadow:0 6px 16px rgba(29,43,83,.2)}.ph-av2 img+img{margin-left:-1.2em}
.ph-heart{position:absolute;left:50%;bottom:-.4em;width:2em;height:2em;margin-left:-1em;border-radius:50%;background:#ff8a5b;color:#fff;display:grid;place-items:center;font-size:.9em;border:2px solid #fff8ef}
.ph-match h4{margin:0;font:700 1.7em/1.1 Georgia,serif;color:#1d2b53}.ph-match p{margin:0;font-size:.85em;color:#5f6478;max-width:16em}.ph-match .ph-cta{align-self:stretch}
.ph-sub{margin:0;font-size:.78em;color:#6b6d7c}
.ph-list{display:flex;flex-direction:column;gap:.45em}
.ph-row{display:flex;align-items:center;gap:.55em;background:#fff;border-radius:.8em;padding:.45em .55em;border:1.5px solid transparent}.ph-row img{width:2.4em;height:2.4em;border-radius:.55em;object-fit:cover}.ph-row div{flex:1;min-width:0}.ph-row b{font-size:.85em;display:block}
.ph-row em{font-style:normal;font-weight:800;font-size:.8em;color:#1d2b53}
.ph-v{display:flex;flex-direction:column;gap:.18em;margin-top:.25em}.ph-v i{display:block;height:.28em;border-radius:9px;background:#efe6d8;position:relative;overflow:hidden;padding:0;margin:0;border:0}
.ph-v i::after{content:"";position:absolute;inset:0;width:var(--v);background:#1d2b53;border-radius:9px;transform-origin:left;transition:transform .9s .2s cubic-bezier(.22,.61,.36,1);transform:scaleX(0)}.ph-v i+i::after{background:#ff8a5b}
.ph-s.on .ph-v i::after{transform:scaleX(1)}
.ph-row.won{border-color:#ff8a5b;background:#fff3ea}
.ph-won{margin-top:auto;text-align:center;font-weight:800;font-size:.85em;color:#3f8f55;background:#e8f5ea;border-radius:99px;padding:.5em}
.ph-venue{border-radius:1em;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(29,43,83,.1)}.ph-venue img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.ph-venue div{padding:.6em .8em}.ph-venue b{display:block;font-size:1em}.ph-venue small{font-size:.75em;color:#6b6d7c}
.ph-voted{display:flex;align-items:center;gap:.5em;font-size:.8em;font-weight:600}.ph-voted b{margin-left:auto;color:#ff8a5b}
.ph-avs{display:inline-flex}.ph-avs img{width:1.9em;height:1.9em;border-radius:50%;object-fit:cover;object-position:50% 4%;border:2px solid #fff}.ph-avs img+img{margin-left:-.6em}
.ph-voted+.ph-cta{margin-top:auto}
.ph-okb{background:#2f9e74;color:#fff;font-weight:800;font-size:.85em;padding:.55em .8em;border-radius:.6em}
.ph-date{background:#fff;border:1.5px solid #1a2140;border-radius:1em;padding:.8em;display:flex;flex-direction:column;gap:.2em}.ph-date small{font-size:.72em;color:#6b6d7c;font-weight:600}.ph-date b{font-size:1.15em}.ph-date span{font:700 1.6em Georgia,serif;color:#ff8a5b}.ph-date .ph-cta{background:#1a2140;margin-top:.5em}
.ph-chat{display:flex;flex-direction:column;gap:.35em;margin-top:auto}.ph-chat p{margin:0;padding:.5em .8em;border-radius:1em;font-size:.82em;max-width:80%}.ph-chat .ot{background:#fff;border:1px solid #ecdcc6;align-self:flex-start}.ph-chat .me{background:#1d2b53;color:#fff;align-self:flex-end}
.co{position:absolute;z-index:6;background:#fff;color:#1a2140;border-radius:16px;padding:10px 14px;font:700 14px/1.3 -apple-system,system-ui,sans-serif;box-shadow:0 14px 34px -14px rgba(15,20,38,.45);border:2px solid #1d2b53;opacity:0;transform:translateY(16px) scale(.85);transition:opacity .45s ease,transform .6s cubic-bezier(.34,1.56,.64,1);pointer-events:none;white-space:nowrap;text-align:left}
.co.on{opacity:1;transform:none}
.co b{display:block;margin-bottom:6px}
.ph-bar{display:grid;grid-template-columns:70px 90px;align-items:center;gap:8px;font-size:12px;font-weight:600;margin-top:4px}.ph-bar b{display:block;height:7px;border-radius:9px;background:#efe6d8;position:relative;margin:0;overflow:hidden}.ph-bar b::after{content:"";position:absolute;inset:0;width:var(--v);background:#ff8a5b;border-radius:9px}
.co-h,.co-ok,.co-ck{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#ff8a5b;color:#fff;margin-right:8px;font-size:13px}.co-ok{background:#2f9e74}.co-ck{border-radius:6px}
.co-ck2{display:inline-block;width:24px;height:24px;border-radius:6px;border:2px solid #cfc3b1;margin:6px 8px 0 0;vertical-align:middle}
.co .ph-avs{font-size:16px;margin-right:8px;vertical-align:middle}
.ph-tiles{display:grid;grid-template-columns:1fr 1fr;gap:.5em}
.ph-tile{position:relative;border-radius:.9em;overflow:hidden;aspect-ratio:1;background:#efe6d8}
.ph-tile img{width:100%;height:100%;object-fit:cover;filter:blur(5px) saturate(.9);transform:scale(1.15)}
.ph-tile span{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-weight:800;font-size:1.6em;text-shadow:0 2px 8px rgba(0,0,0,.35)}
.ph-tile.hit{box-shadow:0 0 0 2px #ff8a5b}
.ph-s.on .ph-tile.hit{animation:ph-pop .7s cubic-bezier(.34,1.56,.64,1) .5s both}
.ph-tile.hit span{font-size:1.4em}
.ph-tile.hit span::before{content:"♥";color:#ff8a5b;background:#fff;width:1.6em;height:1.6em;border-radius:50%;display:grid;place-items:center;text-shadow:none;font-size:.8em;position:absolute}
.ph-tile.hit span{color:transparent}
@keyframes ph-pop{0%{transform:scale(.9)}60%{transform:scale(1.06)}100%{transform:none}}
.ph-won{color:#c4512a;background:#ffe9dc}
.ph-blur{position:relative}.ph-blur img{filter:blur(4px);transform:scale(1.08)}
.ph-pin{position:absolute;left:50%;top:32%;transform:translate(-50%,-50%);font-style:normal;font-size:1.8em;background:#fff;border-radius:50%;width:1.7em;height:1.7em;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.25);padding:0;margin:0;border:0}
.ph-voted{justify-content:center}
