/* Home page, ported from the prototype (apeiq-prototype.html).
 * These are the prototype's own rules for its home, found by matching them against its home in a browser,
 * with every class renamed p-<name> and scoped to .ph so they cannot clash with the rest of the site. */
.ph{--slip-2:#111821;--bull-soft:#0a2a1a;--bear-soft:#2d1016;--signal-soft:#0e2140;--money-soft:#1e1533;--pit-ink:#0a0700;--muted:#7c8896;--ink2:#d3dae2;color:var(--ink);font-family:var(--body)}
.ph p,.ph h1,.ph h2,.ph h3{margin:0}.ph a{color:inherit;text-decoration:none}.ph .p-tx a,.ph .p-brief a{color:var(--pit)}
.ph *{box-sizing: border-box;}
.ph button, .ph input, .ph select, .ph textarea{font: inherit; color: inherit;}
.ph button{cursor: pointer;}
.ph .p-num{font-family: var(--data); font-variant-numeric: tabular-nums;}
.ph .p-up{color: var(--bull);}
.ph .p-down{color: var(--bear);}
.ph .p-slip{background: linear-gradient(180deg,var(--well2) 0%,var(--slip) 60px); border: 1px solid var(--edge); border-radius: 8px; box-shadow: rgba(255, 255, 255, 0.03) 0px 1px 0px inset, rgb(0, 0, 0) 0px 20px 40px -20px; position: relative;}
.ph .p-label{font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin: 0px 0px 8px;}
.ph .p-hint{font-size: 12px; color: var(--muted);}
.ph .p-live{font-family: var(--data); font-size: 9.5px; font-weight: 700; letter-spacing: 0.1em; color: var(--bear); border: 1px solid var(--bear); padding: 0px 5px; border-radius: 3px; display: inline-flex; align-items: center; gap: 4px;}
.ph .p-live::before{content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--bear); box-shadow: 0 0 6px var(--bear); animation: 1.1s ease 0s infinite normal none running p-blink;}
.ph .p-seg{display: inline-flex; padding: 2px; background: var(--well2); border: 1px solid var(--edge); border-radius: 5px;}
.ph .p-seg button{border: 0px; background: transparent; padding: 3px 10px; border-radius: 3px; font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);}
.ph .p-seg button[aria-pressed="true"]{background: var(--raised); color: var(--ink);}
.ph .p-msg{display: grid; grid-template-columns: 40px minmax(0px, 1fr); gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--grid);}
.ph .p-msg.p-new{animation: 0.9s ease-out 0s 1 normal none running p-flash;}
.ph .p-badge-av{width: 40px; height: 26px; border-radius: 4px; display: grid; place-items: center; font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.06em; color: rgb(255, 255, 255); margin-top: 1px; border-left: 3px solid rgba(255, 255, 255, 0.55); background-image: linear-gradient(rgba(255, 255, 255, 0.14), rgba(0, 0, 0, 0.18));}
.ph .p-mh{display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap;}
.ph .p-mh .p-h{font-weight: 600;}
.ph .p-mh .p-t{margin-left: auto; font-family: var(--data); font-size: 11px; color: var(--muted);}
.ph .p-ttl{font-family: var(--data); font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding: 1px 5px; border-radius: 3px; border: 1px solid var(--edge); color: var(--muted);}
.ph .p-sc{font-family: var(--data); font-size: 11px; color: var(--muted);}
.ph .p-tx{margin: 3px 0px 0px; overflow-wrap: anywhere; color: var(--ink2);}
.ph .p-symtag{font-family: var(--data); font-size: 11px; font-weight: 700; color: var(--pit);}
.ph .p-ticket{display: inline-flex; align-items: stretch; margin-top: 7px; border: 1px solid var(--edge); border-radius: 4px; overflow: hidden; font-family: var(--data); font-size: 11px; font-weight: 700; background: var(--well2);}
.ph .p-ticket .p-tside{padding: 3px 8px; letter-spacing: 0.06em;}
.ph .p-ticket.p-bull .p-tside{background: var(--bull-soft); color: var(--bull); border-right: 1px solid rgb(19, 74, 46);}
.ph .p-ticket.p-bear .p-tside{background: var(--bear-soft); color: var(--bear); border-right: 1px solid rgb(90, 26, 36);}
.ph .p-ticket .p-info{padding: 3px 8px; color: var(--ink2);}
.ph .p-reacts{display: flex; gap: 5px; margin-top: 8px; flex-wrap: wrap;}
.ph .p-reacts button{border: 1px solid var(--edge); background: transparent; border-radius: 12px; padding: 1px 8px; font-size: 12px; display: inline-flex; align-items: center; gap: 5px;}
.ph .p-reacts button:hover{border-color: var(--edge2);}
.ph .p-reacts .p-n{font-family: var(--data); font-size: 11px; color: var(--muted);}
.ph .p-meme{margin-top: 8px; max-width: 330px; border: 1px solid var(--edge); border-radius: 6px; overflow: hidden; background: var(--deep); color: rgb(255, 255, 255); position: relative;}
.ph .p-meme svg{display: block; width: 100%; height: auto;}
.ph .p-meme .p-cap{position: absolute; left: 0px; right: 0px; text-align: center; font-family: var(--display); font-stretch: 112%; font-weight: 800; font-size: 20px; line-height: 1.05; text-transform: uppercase; padding: 8px; text-shadow: rgb(0, 0, 0) 0px 2px 0px, rgb(0, 0, 0) 2px 0px 0px, rgb(0, 0, 0) -2px 0px 0px, rgb(0, 0, 0) 0px -2px 0px;}
.ph .p-meme .p-cap.p-t{top: 0px;}
.ph .p-meme .p-cap.p-b{bottom: 0px;}
.ph .p-result{margin-top: 8px; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; border: 1px solid var(--edge); border-radius: 6px; background: var(--well2); padding: 10px 12px; max-width: 470px;}
.ph .p-stamp{font-family: var(--data); font-weight: 700; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 10px; border-radius: 4px; border: 1px solid currentcolor;}
.ph .p-stamp.p-up{background: var(--bull-soft); box-shadow: rgba(31, 209, 122, 0.2) 0px 0px 14px;}
.ph .p-stamp.p-down{background: var(--bear-soft); box-shadow: rgba(255, 75, 92, 0.2) 0px 0px 14px;}
.ph .p-result .p-d{font-size: 12px; color: var(--muted);}
.ph .p-result button{margin-left: auto; border: 1px solid var(--edge); background: var(--slip-2); border-radius: 4px; padding: 4px 10px; font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.04em;}
.ph .p-result button:hover{border-color: var(--pit);}
.ph .p-crow{display: flex; gap: 8px; align-items: center; flex-wrap: wrap;}
.ph .p-home{display: grid; grid-template-columns: minmax(0px, 1fr) 320px; gap: 14px; align-content: start; padding-bottom: 10px;}
.ph .p-hmain{display: flex; flex-direction: column; gap: 14px; min-width: 0px;}
.ph .p-sec-h{display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 14px 16px 10px; border-bottom: 1px solid var(--edge);}
.ph .p-sec-h h2{margin: 0px; font-family: var(--display); font-stretch: 112%; font-weight: 700; font-size: 17px; letter-spacing: 0.01em;}
.ph .p-sec-h span{font-size: 12px; color: var(--muted);}
.ph .p-sec-b{padding: 10px 16px 14px;}
.ph .p-linkbtn{border: 0px; background: none; padding: 0px; font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pit);}
.ph .p-watch{list-style: none; margin: 0px; padding: 0px;}
.ph .p-why{font-size: 13px; min-width: 0px; color: var(--ink2);}
.ph .p-why .p-mood{display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; font-family: var(--data);}
.ph .p-shift{font-family: var(--data); font-size: 10.5px; font-weight: 700; padding: 0px 4px; margin-left: 6px; border-radius: 3px;}
.ph .p-shift.p-up{background: var(--bull-soft);}
.ph .p-shift.p-down{background: var(--bear-soft);}
.ph .p-bestgrid{display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; align-items: start;}
.ph .p-bestgrid h3{margin: 0px 0px 8px; font-family: var(--data); font-weight: 700; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--pit);}
.ph .p-bestgrid .p-msg, .ph .p-tops .p-msg{padding: 0px; border: 0px; grid-template-columns: 40px minmax(0px, 1fr);}
.ph .p-tops .p-msg{padding: 10px 0px; border-top: 1px solid var(--grid);}
.ph .p-tops .p-msg:first-child{border-top: 0px;}
.ph .p-bestgrid .p-meme{max-width: 100%;}
.ph .p-home{grid-template-columns: 230px minmax(0px, 1fr) 320px;}
@media (max-width: 1200px){.ph .p-home{grid-template-columns: minmax(0px, 1fr);}}
.ph .p-home{grid-template-columns: 208px minmax(0px, 1fr) 276px; gap: 12px;}
.ph .p-hmain{gap: 12px;}
.ph .p-missed{border-color: rgb(74, 54, 0); background: linear-gradient(180deg,#151006 0%,var(--slip) 240px); padding: 18px 20px 20px; display: grid; gap: 18px;}
.ph .p-missed-h{display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap;}
.ph .p-eyebrow{font-family: var(--data); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--pit);}
.ph .p-missed h1{font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: clamp(28px, 3.3vw, 44px); line-height: 1; margin: 6px 0px 0px; text-wrap: balance;}
.ph .p-missed h1 mark{background: none; color: var(--pit);}
.ph .p-missed-grid{display: grid; grid-template-columns: minmax(0px, 1.55fr) minmax(0px, 1fr); gap: 20px;}
.ph .p-missed .p-label{color: var(--ink); opacity: 0.8;}
.ph .p-moments{list-style: none; margin: 0px; padding: 0px; display: grid; position: relative;}
.ph .p-moments::before{content: ""; position: absolute; left: 51px; top: 10px; bottom: 10px; width: 1px; background: var(--edge);}
.ph .p-moments button{width: 100%; display: grid; grid-template-columns: 42px 14px minmax(0px, 1fr); gap: 0px 8px; align-items: start; text-align: left; border: 0px; background: transparent; padding: 6px 4px; border-radius: 4px;}
.ph .p-moments button:hover{background: var(--slip-2);}
.ph .p-moments .p-tm{font-family: var(--data); font-size: 11px; color: var(--muted); text-align: right; padding-top: 1px;}
.ph .p-moments .p-dot{width: 9px; height: 9px; border-radius: 50%; margin-top: 4px; justify-self: center; position: relative; z-index: 1; box-shadow: 0 0 0 3px var(--slip);}
.ph .p-moments .p-tx2{font-size: 13px; color: var(--ink2); line-height: 1.4;}
.ph .p-moments .p-tx2 b{font-weight: 600; color: var(--ink);}
.ph .p-k-live{background: var(--bear);}
.ph .p-k-pump{background: var(--pit);}
.ph .p-k-odds{background: var(--money);}
.ph .p-k-call{background: var(--bull);}
.ph .p-k-fun{background: rgb(154, 166, 180);}
.ph .p-k-news{background: var(--signal);}
.ph .p-tiles{display: grid; grid-template-columns: 1fr 1fr; gap: 8px;}
.ph .p-tile{border: 1px solid var(--edge); border-radius: 6px; padding: 9px 10px; background: var(--well2); min-width: 0px;}
.ph .p-tile small{display: block; font-family: var(--data); font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted);}
.ph .p-tile b{display: block; font-family: var(--data); font-size: 20px; line-height: 1.2; margin-top: 2px;}
.ph .p-tile span{display: block; font-size: 11.5px; color: var(--muted); overflow-wrap: anywhere;}
.ph .p-missed-sub{border-top: 1px solid var(--edge); padding-top: 14px;}
.ph .p-hmain .p-sec-h{padding: 12px 14px 9px;}
.ph .p-hmain .p-sec-h h2{font-size: 15.5px;}
.ph .p-hmain .p-sec-b{padding: 8px 14px 12px;}
@media (max-width: 1200px){.ph .p-home{grid-template-columns: minmax(0px, 1fr);}}
@media (max-width: 1200px){.ph .p-hmain{order: -1;}}
@media (max-width: 900px){.ph .p-missed-grid, .ph .p-duo{grid-template-columns: minmax(0px, 1fr);}}
@media (max-width: 900px){.ph .p-missed{padding: 14px;}}
@media (max-width: 520px){.ph .p-duo .p-nowgrid, .ph .p-tiles{grid-template-columns: 1fr;}}
.ph .p-star{border: 1px solid var(--edge); background: transparent; border-radius: 5px; padding: 3px 10px; font-family: var(--data); font-weight: 700; font-size: 11px; letter-spacing: 0.06em; color: var(--muted);}
.ph .p-star:hover{border-color: var(--pit); color: var(--pit);}
.ph .p-home{grid-template-columns: 210px minmax(0px, 1fr) 270px; gap: 16px;}
.ph .p-hmain{gap: 16px;}
.ph .p-missed{gap: 20px;}
.ph .p-moments button{padding: 7px 4px;}
.ph .p-bestgrid{gap: 18px;}
.ph .p-home{max-width: 1040px; width: 100%; margin: 0px auto; grid-template-columns: minmax(0px, 1fr) !important;}
.ph .p-brief{margin: 10px 0px 0px; font-size: 15.5px; line-height: 1.5; color: var(--ink2); max-width: 68ch;}
.ph .p-brief b{color: var(--ink); font-weight: 600;}
.ph .p-act-wrap{border: 1px solid rgb(58, 44, 8); border-radius: 8px; background: rgb(16, 13, 5); padding: 12px 14px;}
.ph .p-act{list-style: none; margin: 0px; padding: 0px; display: grid; gap: 2px;}
.ph .p-act li{display: grid; grid-template-columns: 24px minmax(0px, 1fr) auto; gap: 10px; align-items: center; padding: 7px 0px; border-top: 1px solid rgb(42, 33, 8); font-size: 13px;}
.ph .p-act li:first-child{border-top: 0px;}
.ph .p-act .p-ic{width: 24px; height: 24px; border-radius: 5px; display: grid; place-items: center; font-size: 12px; background: rgb(29, 23, 8); color: var(--pit);}
.ph .p-act .p-ic.p-g{background: var(--bull-soft); color: var(--bull);}
.ph .p-act .p-ic.p-b{background: var(--signal-soft); color: rgb(156, 194, 255);}
.ph .p-act .p-tx3{color: var(--ink2); min-width: 0px;}
.ph .p-act .p-tx3 b{color: var(--ink); font-weight: 600;}
.ph .p-act .p-tx3 q{color: var(--muted); font-style: italic;}
.ph .p-act .p-rt{display: flex; gap: 6px; align-items: center; font-family: var(--data); font-size: 12px; font-weight: 700; white-space: nowrap;}
.ph .p-act .p-rt button{border: 1px solid var(--edge); background: var(--slip-2); border-radius: 4px; padding: 3px 9px; font-family: var(--data); font-size: 11px; font-weight: 700;}
.ph .p-custom{border: 1px solid var(--edge); border-radius: 6px; background: var(--well2); padding: 10px 12px; display: grid; gap: 8px; margin-bottom: 8px;}
.ph .p-custom .p-seg button[aria-pressed="true"]{background: var(--pit); color: var(--pit-ink);}
.ph .p-ck{display: flex; gap: 8px; align-items: center; font-size: 12.5px; cursor: pointer;}
.ph .p-ck input{accent-color: rgb(255, 174, 0);}
.ph .p-sugg{display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px;}
.ph .p-scard2{border: 1px solid var(--edge); border-radius: 6px; background: var(--well2); padding: 10px 12px; display: grid; gap: 6px; text-align: left;}
.ph .p-scard2 .p-top{display: flex; justify-content: space-between; align-items: center; gap: 8px;}
.ph .p-scard2 .p-nm{font-family: var(--display); font-stretch: 112%; font-weight: 700; font-size: 16px; border: 0px; background: none; padding: 0px; color: var(--ink); text-align: left;}
.ph .p-scard2 .p-nm:hover{color: var(--pit);}
.ph .p-scard2 .p-why2{font-size: 12px; color: var(--muted);}
.ph .p-scard2 .p-num{font-size: 12px;}
.ph .p-pv{display: inline-flex; align-items: center; gap: 3px; font-family: var(--data); font-size: 9.5px; font-weight: 700; letter-spacing: 0.06em; color: rgb(11, 24, 48); background: rgb(127, 176, 255); border-radius: 3px; padding: 0px 5px; line-height: 1.6; vertical-align: 1px;}
.ph .p-wch{width: 100%; display: grid; grid-template-columns: 120px 76px minmax(0px, 1fr); gap: 4px 14px; align-items: baseline; text-align: left; border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: initial; border-top: 1px solid var(--grid); background: transparent; padding: 9px 4px; border-radius: 4px;}
.ph .p-watch li:first-child .p-wch{border-top: 0px;}
.ph .p-wch:hover{background: var(--slip-2);}
.ph .p-wt2{font-family: var(--display); font-stretch: 112%; font-weight: 700; font-size: 15px;}
.ph .p-wc{font-family: var(--data); font-weight: 700; font-size: 13px;}
.ph .p-wquiet{font-size: 12px; color: var(--muted); padding: 9px 4px 0px; border-top: 1px solid var(--grid);}
@media (max-width: 620px){.ph .p-wch{grid-template-columns: auto auto;}}
@media (max-width: 620px){.ph .p-wch .p-why{grid-column: 1 / -1;}}
.ph .p-reacts .p-rp{margin-left: 2px;}
.ph .p-mh button.p-h{border: 0px; background: none; padding: 0px; font-weight: 600; color: inherit; cursor: pointer; text-align: left;}
.ph .p-mh button.p-h:hover{color: var(--pit); text-decoration: underline; text-underline-offset: 3px;}
@media (max-width: 1200px){.ph .p-home{grid-template-columns: minmax(0px, 1fr); overflow: visible;}}
@media (prefers-reduced-motion: reduce){.ph *{animation: auto ease 0s 1 normal none running none !important; transition: none !important;}}
.ph .p-i{width: 15px; height: 15px; display: inline-block; vertical-align: -3px; flex: 0 0 auto;}
.ph .p-badge-av{aspect-ratio: 1 / 1; overflow: hidden; box-shadow: rgba(255, 255, 255, 0.08) 0px 0px 0px 1px; height: auto !important; border-radius: 50% !important; border: 0px !important; background: none var(--raised) !important; padding: 0px !important; margin-top: 0px !important;}
.ph .p-badge-av::after{display: none !important;}
.ph .p-badge-av img{width: 100%; height: 100%; display: block;}
.ph .p-label{font-family: var(--body) !important; font-size: 12.5px !important; font-weight: 600 !important; letter-spacing: 0px !important; text-transform: none !important;}
.ph .p-eyebrow{text-transform: none !important; letter-spacing: 0px !important; font-family: var(--body) !important; font-size: 13px !important; font-weight: 500 !important;}
.ph .p-seg button{font-family: var(--body) !important; text-transform: none !important; letter-spacing: 0px !important; font-size: 13px !important; font-weight: 600 !important;}
.ph .p-ttl{font-family: var(--body) !important; text-transform: none !important; letter-spacing: 0px !important; font-size: 11px !important; font-weight: 600 !important; padding: 0px 6px !important;}
.ph .p-tile small, .ph .p-bestgrid h3, .ph .p-linkbtn{text-transform: none !important; letter-spacing: 0px !important; font-family: var(--body) !important;}
.ph .p-tile small{font-size: 11.5px !important; font-weight: 600 !important;}
.ph .p-slip{box-shadow: none !important;}
.ph .p-live::before{box-shadow: none !important; text-shadow: none !important;}
.ph .p-missed{background: var(--slip) !important; border-color: var(--edge) !important;}
.ph .p-act-wrap{background: var(--well2) !important; border-color: var(--edge) !important;}
.ph .p-act li{border-top-color: var(--grid) !important;}
.ph .p-stamp.p-up, .ph .p-stamp.p-down{box-shadow: none !important;}
.ph .p-pv{background: rgb(61, 139, 255) !important; color: rgb(255, 255, 255) !important; font-family: var(--body) !important; letter-spacing: 0px !important; font-size: 10.5px !important; border-radius: 999px !important; padding: 0px 7px !important; font-weight: 600 !important;}
.ph .p-pv.p-c{width: 14px; height: 14px; place-items: center; vertical-align: -1px; margin-left: 2px; padding: 0px !important; display: inline-grid !important; font-size: 8.5px !important;}
.ph .p-star .p-i{width: 14px; height: 14px;}
.ph .p-missed h1{letter-spacing: -0.01em;}
@media (max-width: 760px){.ph .p-missed{padding: 16px;}}
@media (max-width: 760px){.ph .p-missed h1{font-size: 30px;}}
@media (max-width: 760px){.ph .p-brief{font-size: 14.5px;}}
@media (max-width: 760px){.ph .p-act li{grid-template-columns: 24px minmax(0px, 1fr);}}
@media (max-width: 760px){.ph .p-act .p-rt{grid-column: 2; justify-content: flex-start;}}
@media (max-width: 760px){.ph .p-mh .p-sc{display: none;}}
@media (max-width: 760px){.ph .p-ticket{max-width: 100%; flex-wrap: wrap;}}
.ph .p-tops .p-msg, .ph .p-bestgrid .p-msg{cursor: pointer;}
.ph .p-ttl{cursor: pointer;}
.ph .p-ttl.p-rk1{color: rgb(201, 162, 122); background: rgb(29, 21, 13); border-color: rgb(61, 43, 24);}
.ph .p-ttl.p-rk3{color: rgb(224, 168, 94); background: rgb(36, 24, 10); border-color: rgb(82, 56, 26);}
.ph .p-ttl.p-rk5{color: rgb(242, 182, 61); background: rgb(40, 27, 5); border-color: rgb(102, 69, 18);}
.ph .p-ttl.p-rk8{color: rgb(230, 235, 241); background: linear-gradient(90deg, var(--edge2), rgb(89, 98, 111)); border-color: rgb(135, 146, 161);}
.ph .p-ttl.p-rk9{color: rgb(26, 18, 5); background: linear-gradient(90deg, rgb(255, 211, 107), rgb(255, 174, 0)); border-color: rgb(255, 211, 107); box-shadow: rgba(255, 174, 0, 0.333) 0px 0px 10px;}
@keyframes p-blink { 
  50% { opacity: 0.25; }
}
@keyframes p-flash { 
  0% { background: rgba(42, 31, 5, 0.4); }
  100% { background: transparent; }
}
.ph .p-reacts button.on{border-color:var(--pit);background:#1f1700}
.ph .p-act .p-ic.p-r{background:var(--bear-soft);color:var(--bear)}
.ph .p-act .p-ic.p-n{background:var(--raised);color:var(--muted)}
.ph .p-badge-av{width:40px;display:block}
.ph .p-mh a.p-h{font-weight:600;text-decoration:none}.ph .p-mh a.p-h:hover{color:var(--pit);text-decoration:underline;text-underline-offset:3px}
.ph .p-symtag{text-decoration:none}
.ph .p-msg .mimg,.ph .p-msg .stk{margin-top:8px}.ph .p-msg .mimg{max-width:100%;border-radius:6px}
.ph .p-more{margin-left:auto;border:0!important;color:var(--muted)}
.ph .p-loadmore{display:block;margin:10px auto 0}
.ph .p-wch{color:inherit;text-decoration:none}
.ph .p-empty{padding:8px 4px}
/* news lines in Key moments link out to the article */
.ph .p-moments a.p-mlink{width:100%;display:grid;grid-template-columns:42px 14px minmax(0,1fr);gap:0 8px;align-items:start;text-align:left;padding:7px 4px;border-radius:4px;text-decoration:none;color:inherit}
.ph .p-moments a.p-mlink:hover{background:var(--slip-2)}
.ph .p-src{font:600 11px var(--data);color:var(--muted);white-space:nowrap}
.ph .p-moments{max-height: 380px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;}
.ph .p-moments::before{display: none;}
.ph .p-moments li{position: relative;}
.ph .p-moments li::before{content: ""; position: absolute; left: 51px; top: 0; bottom: 0; width: 1px; background: var(--edge);}
.ph .p-moments li:first-child::before{top: 12px;}
.ph .p-moments li:last-child::before{bottom: calc(100% - 12px);}
.ph .p-moments li.p-seen{opacity: .55;}
.ph .p-join{display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-color: #5a4210; background: linear-gradient(90deg, rgba(255,174,0,.10), transparent 70%);}
.ph .p-join div{flex: 1; font-size: 14px; color: var(--ink2); line-height: 1.45;}
.ph .p-join b{color: var(--ink);}
.ph .p-join .btn{flex: none;}
@media (max-width: 760px){.ph .p-join{flex-direction: column; align-items: stretch;}}

[data-theme="light"] .ph .p-join{border-color: #f3d58a; background: linear-gradient(90deg, rgba(255,174,0,.14), transparent 70%);}
[data-theme="light"] .ph .p-brief b, [data-theme="light"] .ph .p-tx3 b{color: var(--ink);}

/* post box above the feed (home) */
.ph .p-hcwrap{padding: 14px 16px;}
.ph .hc{display: grid; gap: 10px;}
.ph .hc-top{display: flex; gap: 12px; align-items: flex-start;}
.ph .hc-top .av{flex: none; width: 40px; height: 40px;}
.ph .hc-guest{border-radius: 50%; background: var(--raised);}
.ph .hc textarea{flex: 1; min-width: 0; border: 0; background: transparent; resize: none; outline: none; font-size: 15px; line-height: 1.45; color: var(--ink); padding: 9px 0 0; min-height: 40px;}
.ph .hc textarea::placeholder{color: var(--muted);}
.ph .hc-bar{display: flex; align-items: center; gap: 6px; flex-wrap: wrap;}
.ph .hc-seg{display: inline-flex; border: 1px solid var(--edge2); border-radius: 999px; overflow: hidden; margin-right: 6px;}
.ph .hc-seg button{border: 0; background: transparent; padding: 6px 14px; font-size: 13.5px; font-weight: 600; color: var(--ink2);}
.ph .hc-seg button + button{border-left: 1px solid var(--edge2);}
.ph .hc-seg button[data-dir="bull"].on{background: var(--bull-soft); color: var(--bull);}
.ph .hc-seg button[data-dir="bear"].on{background: var(--bear-soft); color: var(--bear);}
.ph .hc-hz{border: 1px solid var(--edge2); background: var(--well); border-radius: 999px; padding: 5px 10px; font-size: 13px;}
.ph .hc-ic{width: 34px; height: 34px; display: grid; place-items: center; border: 0; background: transparent; border-radius: 50%; color: var(--muted); cursor: pointer;}
.ph .hc-ic:hover{background: var(--slip-2); color: var(--ink);}
.ph .hc-ic svg{width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;}
.ph .hc-gif{width: auto; padding: 0 6px; border-radius: 6px; font: 800 10.5px var(--data); letter-spacing: .04em;}
.ph .hc-gif::before{content: none;}
.ph .hc-post{margin-left: auto; border: 0; border-radius: 999px; padding: 8px 22px; font-weight: 700; font-size: 14px; background: var(--pit); color: var(--pit-ink);}
.ph .hc-post:disabled{background: var(--raised); color: var(--muted); cursor: default;}
.ph .hc-hint{margin: 0; font-size: 12.5px;}
.ph .hc .cpanel{margin: 0;}
@media (max-width: 760px){.ph .hc-seg button{padding: 6px 11px;} .ph .hc-ic{width: 30px;}}
.ph .composer.hc{border: 0; padding: 0; margin: 0; background: none;}
/* "Your activity": two lines tall, scroll for the rest */
.ph .p-act{max-height: 84px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;}
/* Best of: compact cards */
.ph .mini{display: grid; gap: 7px; padding: 11px 12px; border: 1px solid var(--edge); border-radius: 8px; background: var(--well2); color: inherit; text-decoration: none; min-width: 0;}
.ph .mini:hover{border-color: var(--edge2); background: var(--slip-2);}
.ph .mini-h{display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 12.5px;}
.ph .mini-h .av{width: 22px; height: 22px; flex: none;}
.ph .mini-h b{color: var(--ink); font-weight: 700;}
.ph .mini-h span:last-child{color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ph .mini-b{display: flex; gap: 10px; align-items: flex-start; min-width: 0;}
.ph .mini-b img{width: 44px; height: 44px; border-radius: 6px; object-fit: cover; flex: none;}
.ph .mini-ic{font-style: normal; font-size: 22px; line-height: 1;}
.ph .mini-t{font-size: 13.5px; line-height: 1.4; color: var(--ink2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-width: 0;}
.ph .mini-res{font: 700 11.5px var(--data); letter-spacing: .04em; color: var(--muted);}
.ph .mini-res.up{color: var(--bull);} .ph .mini-res.dn{color: var(--bear);}
.ph .mini-f{font-size: 12px; color: var(--muted);}
/* By the numbers: no grey explanation line; on phones, two small tiles per row */
.ph .p-tile > span{display: none;}
@media (max-width: 520px){
  .ph .p-tiles{grid-template-columns: 1fr 1fr !important; gap: 6px;}
  .ph .p-tile{padding: 7px 9px;}
  .ph .p-tile small{font-size: 10.5px !important;}
  .ph .p-tile b{font-size: 16px; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
}

/* Phones: + button and full-screen post page */
.fab{display:none}
@media (max-width: 760px){
  .fab{display:grid;place-items:center;position:fixed;right:16px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:26;width:54px;height:54px;border-radius:50%;border:0;background:var(--pit);color:var(--pit-ink);box-shadow:0 6px 18px rgba(0,0,0,.45);cursor:pointer}
  .fab svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
  body.noscroll .fab{display:none}
}
.ph.pm{position:fixed;left:0;right:0;top:0;height:100dvh;z-index:60;background:var(--floor)}
.ph .pm-f{display:flex;flex-direction:column;height:100%;gap:0;border:0;padding:0;margin:0;background:none}
.ph .pm-h{display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid var(--edge);padding-top:calc(10px + env(safe-area-inset-top))}
.ph .pm-x{border:0;background:none;color:var(--ink);width:36px;height:36px;display:grid;place-items:center;margin-right:auto;cursor:pointer}
.ph .pm-x svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ph .pm-left{font:600 15px var(--data);color:var(--muted)}
.ph .pm-left.low{color:var(--pit)}
.ph .pm-post{border:0;border-radius:999px;padding:9px 26px;font-weight:700;font-size:15px;background:var(--ink);color:var(--floor);cursor:pointer}
.ph .pm-post:disabled{opacity:.45;cursor:default}
.ph .pm-b{flex:1;overflow-y:auto;padding:14px;display:grid;align-content:start;gap:10px}
.ph .pm-b .hc-top .av{width:46px;height:46px}
.ph .pm-b textarea{min-height:30vh;font-size:17px;padding-top:10px}
.ph .pm-foot{border-top:1px solid var(--edge);padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:var(--topbg)}
.ph .pm-foot .cpanel{margin:0 0 8px;max-height:40vh;overflow-y:auto}
.ph .pm-foot .hc-bar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.ph .pm-foot .hc-bar > *{flex:none}
.ph .pm-foot .hc-hz{font-size:12.5px;padding:4px 6px}
.ph .pm-foot .hc-hint{margin:0 4px 8px}
@media (max-width: 760px){ .ph .p-hcwrap{display:none} }
