

:root{
  
  --pph-logo-h: 62px;
  --pph-logo-h-mobile: 44px;

  
  
  --pph-chrome: #040404;
  --pph-bar: #17171a;          
  --pph-seam: var(--pph-bar);
  
  --pph-rail-bg: #0f0f11;
  --pph-rail-ink: #eae8e4;     /* = --pp-ink      */
  --pph-rail-muted: #979795;   /* = --pp-muted    */
  --pph-rail-tile: #2b2b2e;    /* = --pp-surface2 */
  --pph-rail-tile-b: transparent;
  --pph-rail-accent: #f5d601;
  --pph-rail-hot: #00dfff;
  --pph-rail-good: #3ef08c;
  --pph-rail-gold: #f2c53d;

  --pph-surface: #212124;      /* = --pp-surface  */
  --pph-surface2: #2b2b2e;     /* = --pp-surface2 */
  --pph-surface3: #353539;     /* = --pp-surface3 */
  --pph-border: var(--pph-bar);
  --pph-r-panel: 5px;
  --pph-r-ctl: 5px;
  --pph-ink: #eae8e4;          /* = --pp-ink   */
  --pph-muted: #979795;        /* = --pp-muted */
  --pph-faint: #6f6f6d;        /* = --pp-faint */
  --pph-accent: #f5d601;
  --pph-accent-hi: #ffe64a;
  --pph-on-accent: #1f1a00;
  --pph-accent2: #00dfff;
  --pph-grad: linear-gradient(135deg, #f5d601, #c9ac00);
  --pph-grad-hi: linear-gradient(135deg, #ffe64a, #e0c100);
  --pph-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.pph-head{position:relative;z-index:60}
.pph-top{
  
  background:var(--pph-chrome);
  
  --head-h: 100px;
  --nav-text: 14px;
  --nav-text-weight: 600;
  --nav-ls: 0.08em;
  --nav-text-case: uppercase;
  --c-nav-blip: #aaa;
}
.pph-top-in{
  height:var(--head-h);
  display:flex;align-items:center;gap:18px;
}
.pph-lead{display:none}
.pph-logo-slot{display:flex;align-items:center;flex:none}
.pph-nav{display:flex;height:100%;flex:1;justify-content:center;min-width:0}
.pph-nav .nav-wrap,.pph-nav .navigation{height:100%}

.pph-nav .nav-wrap{display:flex;justify-content:center}
.pph-right{display:flex;align-items:center;gap:9px;flex:none}

.pph-burger,.pph-acct-btn,.pph-drawer-close,.pph-dchev{
  box-sizing:border-box;height:auto;line-height:1;padding:0;margin:0;
  box-shadow:none;text-transform:none;letter-spacing:0;
  background:none;border:0;border-radius:var(--pph-r-ctl);transition:none;
}
.pph-burger:hover,.pph-burger:focus,
.pph-acct-btn:hover,.pph-acct-btn:focus,
.pph-drawer-close:hover,.pph-drawer-close:focus,
.pph-dchev:hover,.pph-dchev:focus{background:none;box-shadow:none;text-decoration:none}
.pph-burger:focus-visible,.pph-acct-btn:focus-visible,
.pph-drawer-close:focus-visible,.pph-dchev:focus-visible{
  outline:2px solid var(--pph-accent2);outline-offset:2px;
}

.pph-right .search-icon,
.pph-cell-tools .search-icon,
.pph-right .scheme-switcher .toggle,
.pph-cell-tools .scheme-switcher .toggle{
  width:34px;height:34px;border-radius:var(--pph-r-ctl);
  border:0;background:var(--pph-surface2);color:var(--pph-muted);
  display:grid;place-items:center;flex:none;
  font-size:15px;line-height:1;text-decoration:none;
  transition:background .12s,color .12s;
}
.pph-right .search-icon:hover,
.pph-cell-tools .search-icon:hover,
.pph-right .scheme-switcher .toggle:hover,
.pph-cell-tools .scheme-switcher .toggle:hover{background:var(--pph-surface3);color:var(--pph-ink)}
.pph-right .scheme-switcher,
.pph-cell-tools .scheme-switcher{display:flex}

.pph-burger{
  width:34px;height:34px;border-radius:var(--pph-r-ctl);
  border:0;background:var(--pph-surface2);color:#f0f0f0;
  display:grid;place-items:center;cursor:pointer;
}
.pph-burger:hover,.pph-burger:focus{background:var(--pph-surface3);border-color:transparent;color:#f0f0f0}

/* ── logo ──────────────────────────────────────────────────────────────── */
.logo-link.pph-logo-link{display:flex;align-items:center}
.pph-logo-svg{display:block;line-height:0}
.pph-logo-svg svg{display:block;width:auto;height:var(--pph-logo-h);max-width:100%}

/* ── rail ──────────────────────────────────────────────────────────────── */
.pph-rail{
  background:var(--pph-rail-bg);
  border-top:1px solid var(--pph-seam);
  border-bottom:1px solid var(--pph-seam);
  position:relative;
}

.pph-rail-in{
  height:58px;
  display:grid;grid-template-columns:repeat(3,1fr);
}
/* No upcoming product in pp_upcoming -> the set cell is not rendered at all;
   two columns instead of an empty right third. The narrower widths already
   collapse to 2-col / flex and need nothing here. */
.pph-rail-in.pph-no-set{grid-template-columns:repeat(2,1fr)}
.pph-cell{
  display:flex;align-items:center;gap:11px;padding:0 18px;min-width:0;position:relative;
}
.pph-cell + .pph-cell{border-left:1px solid var(--pph-seam)}
.pph-cell:first-child{padding-left:0}
.pph-cell:last-child{padding-right:0}

.pph-cell-tools{display:none;border-left:0}
.pph-txt{min-width:0;display:flex;flex-direction:column;justify-content:center}

.pph-lb{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--pph-rail-muted);line-height:1.35;white-space:nowrap;
}
.pph-lb.is-steam{color:var(--pph-rail-good)}
.pph-lb.is-ocg{color:var(--pph-rail-gold)}
.pph-rail-hol{color:var(--pph-hc);font-weight:700;letter-spacing:.09em}

.pph-val{
  font-size:14px;line-height:1.35;color:var(--pph-rail-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pph-val b{font-family:var(--pph-mono);font-weight:700;font-variant-numeric:tabular-nums}
.pph-cd{color:var(--pph-rail-accent)} .pph-cd.is-hot{color:var(--pph-rail-hot)}

/* icon tile */
.pph-ico{
  width:32px;height:32px;border-radius:var(--pph-r-ctl);
  background:var(--pph-rail-tile);border:0;
  display:grid;place-items:center;color:var(--pph-rail-muted);flex:none;
  position:relative;overflow:hidden;
}
.pph-ico.is-steam{color:var(--pph-rail-good);
  border-color:color-mix(in srgb,var(--pph-rail-good) 35%,transparent);
  background:color-mix(in srgb,var(--pph-rail-good) 10%,transparent)}
.pph-ico.is-ocg{color:var(--pph-rail-gold);
  border-color:color-mix(in srgb,var(--pph-rail-gold) 35%,transparent);
  background:color-mix(in srgb,var(--pph-rail-gold) 10%,transparent)}
.pph-ico.pph-themed{
  color:var(--pph-hc);
  border-color:color-mix(in srgb,var(--pph-hc) 40%,transparent);
  background:color-mix(in srgb,var(--pph-hc) 12%,transparent);
}

/* the run-up bar is the cell's BOTTOM EDGE, not an overlay on the text */
.pph-setbar{position:absolute;left:18px;right:0;bottom:0;height:3px;background:var(--pph-seam)}
.pph-setbar i{display:block;height:100%;background:var(--pph-rail-accent)}

/* sparkline */
.pph-spark{margin-left:auto;flex:none;display:block;width:58px;height:22px}
.pph-spark svg{display:block}
.pph-spark .fill{fill:color-mix(in srgb,var(--pph-rail-good) 16%,transparent);stroke:none}
.pph-spark .line{fill:none;stroke:var(--pph-rail-good);stroke-width:1.6;stroke-linejoin:round}
.pph-spark .now{fill:var(--pph-rail-good);stroke:none}

.pph-rail-fx{position:absolute;inset:0;pointer-events:none;color:var(--pph-fxc,var(--pph-hc))}
.pph-rail-fx i{position:absolute;display:block;background:currentColor;border-radius:999px;opacity:.9}

@keyframes pph-fall{0%{transform:translateY(-8px);opacity:0}15%{opacity:.9}
  100%{transform:translateY(34px);opacity:0}}
.pph-fx-snow .pph-rail-fx i,.pph-fx-confetti .pph-rail-fx i{width:3px;height:3px;animation:pph-fall 2.8s linear infinite}
.pph-fx-confetti .pph-rail-fx i{border-radius:1px;width:3px;height:5px}
.pph-fx-snow .pph-rail-fx i:nth-child(1),.pph-fx-confetti .pph-rail-fx i:nth-child(1){left:6px;animation-delay:0s}
.pph-fx-snow .pph-rail-fx i:nth-child(2),.pph-fx-confetti .pph-rail-fx i:nth-child(2){left:15px;animation-delay:.9s}
.pph-fx-snow .pph-rail-fx i:nth-child(3),.pph-fx-confetti .pph-rail-fx i:nth-child(3){left:23px;animation-delay:1.8s}

@keyframes pph-beat{0%,100%{transform:scale(1)}12%{transform:scale(1.22)}24%{transform:scale(1)}
  36%{transform:scale(1.16)}48%{transform:scale(1)}}
.pph-fx-beat svg{animation:pph-beat 2.4s ease-in-out infinite}

@keyframes pph-spark{0%{transform:rotate(var(--a)) translateY(0) scale(1);opacity:0}
  12%{opacity:1}100%{transform:rotate(var(--a)) translateY(12px) scale(.35);opacity:0}}
.pph-fx-fireworks .pph-rail-fx i{width:2.6px;height:2.6px;left:14.7px;top:14.7px;
  animation:pph-spark 1.9s cubic-bezier(.15,.75,.35,1) infinite}
.pph-fx-fireworks .pph-rail-fx i:nth-child(1){--a:0deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(2){--a:45deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(3){--a:90deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(4){--a:135deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(5){--a:180deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(6){--a:225deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(7){--a:270deg}
.pph-fx-fireworks .pph-rail-fx i:nth-child(8){--a:315deg}
@keyframes pph-core{0%,100%{opacity:.35;transform:scale(.9)}8%{opacity:1;transform:scale(1.1)}
  30%{opacity:.5;transform:scale(1)}}
.pph-fx-fireworks svg{animation:pph-core 1.9s ease-out infinite}

@keyframes pph-flicker{0%,100%{opacity:1}42%{opacity:1}46%{opacity:.55}50%{opacity:1}
  72%{opacity:1}76%{opacity:.65}80%{opacity:1}}
.pph-fx-flicker svg{animation:pph-flicker 3.2s ease-in-out infinite}

@keyframes pph-tumble{0%{transform:translateY(-6px) rotate(0)}100%{transform:translateY(32px) rotate(220deg)}}
.pph-fx-tumble .pph-rail-fx i{width:5px;height:4px;border-radius:60% 20% 60% 20%;
  animation:pph-tumble 3.4s linear infinite}
.pph-fx-tumble .pph-rail-fx i:nth-child(1){left:7px;animation-delay:0s}
.pph-fx-tumble .pph-rail-fx i:nth-child(2){left:17px;animation-delay:1.7s}

/* seasons — one slow loop, no particles */
@keyframes pph-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes pph-spin{to{transform:rotate(360deg)}}
@keyframes pph-twinkle{0%,100%{opacity:.72}50%{opacity:1}}
.pph-fx-sway svg{animation:pph-sway 6s ease-in-out infinite}
.pph-fx-spinslow svg{animation:pph-spin 22s linear infinite}
.pph-fx-twinkle svg{animation:pph-twinkle 5s ease-in-out infinite}

/* ── the drawer (ours — the theme's off-canvas is not rendered) ────────── */
.pph-scrim{
  position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:90;
  opacity:0;visibility:hidden;
  transition:opacity .2s,visibility 0s linear .2s;
}
.pph-drawer-open .pph-scrim{opacity:1;visibility:visible;transition:opacity .2s,visibility 0s}
.pph-drawer{
  position:fixed;inset:0 auto 0 0;width:min(86vw,330px);z-index:95;
  background:var(--pph-surface);border-right:0;
  transform:translateX(-100%);transition:transform .22s ease-out;
  overflow:auto;padding:16px;color:var(--pph-ink);
}
.pph-drawer-open .pph-drawer{transform:translateX(0)}
/* the page behind must not scroll while the drawer is open */
html.pph-drawer-open,body.pph-drawer-open{overflow:hidden}
/* stay clear of the WP admin bar (32px, 46px under 783px) */
.admin-bar .pph-drawer{top:32px}
@media (max-width:782px){.admin-bar .pph-drawer{top:46px}}

.pph-drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
/* the SAME logo partial the header renders — capped here, never huge */
.pph-drawer .pph-logo-svg svg{height:38px}
.pph-drawer-close{
  width:34px;height:34px;border-radius:var(--pph-r-ctl);border:0;
  background:var(--pph-surface2);color:var(--pph-muted);display:grid;place-items:center;
  cursor:pointer;font-size:14px;
}
.pph-drawer-close:hover,.pph-drawer-close:focus{
  background:var(--pph-surface3);color:var(--pph-ink);
}

.pph-drawer-k{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--pph-muted);margin:0 0 10px;
}

.pph-dnav{position:static}
.pph-dmenu,.pph-dmenu ul{list-style:none;margin:0;padding:0}
.pph-dmenu > li + li{border-top:1px solid var(--pph-border)}
.pph-dmenu li{position:relative}
.pph-dmenu a{
  display:block;padding:13px 12px;border-radius:var(--pph-r-ctl);color:var(--pph-ink);
  text-decoration:none;font-size:14px;font-weight:700;
  text-transform:uppercase;letter-spacing:.28px;
}
.pph-dmenu a:hover{color:var(--pph-accent)}
/* submenu: closed by default, chevron toggled by child.js */
.pph-dmenu .sub-menu{display:none;padding:0 12px 12px}
.pph-dmenu li.pph-open > .sub-menu{display:block}
.pph-dmenu .sub-menu a{
  padding:8px 10px;font-weight:400;text-transform:none;letter-spacing:0;
  color:var(--pph-ink);border-radius:var(--pph-r-ctl);
}
.pph-dmenu .sub-menu a:hover{background:color-mix(in srgb,var(--pph-accent) 9%,transparent);color:var(--pph-ink)}
.pph-dchev{
  position:absolute;top:6px;right:2px;width:34px;height:34px;border:0;background:none;
  color:var(--pph-muted);display:grid;place-items:center;cursor:pointer;
}
.pph-dchev svg{transition:transform .18s}
.pph-dmenu li.pph-open > .pph-dchev svg{transform:rotate(180deg)}
.pph-dmenu li.pph-open > a{color:var(--pph-accent)}

/* ── auth: signed out — the button and its v6 drop ─────────────────────── */
.pph-auth{position:relative;display:flex;align-items:center}
.pph-auth-btn{
  display:inline-flex;align-items:center;height:34px;padding:0 15px;border-radius:var(--pph-r-ctl);
  background:var(--pph-grad);color:var(--pph-on-accent);font-weight:700;font-size:14px;line-height:1;
  text-decoration:none;white-space:nowrap;
  transition:background .12s ease-out;
}
.pph-auth-btn:hover{background:var(--pph-grad-hi);color:var(--pph-on-accent)}

.pph-auth-drop{
  position:absolute;right:0;top:calc(100% + 9px);width:262px;z-index:120;
  background:var(--pph-surface);border:0;border-radius:var(--pph-r-panel);
  box-shadow:0 22px 50px rgba(0,0,0,.5);padding:14px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s,transform .18s,visibility 0s linear .18s;
}
.pph-auth[data-open] .pph-auth-drop{
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .18s,transform .18s,visibility 0s;
}

.pph-auth-drop[hidden]{display:none}

.pph-drop-btn{
  display:flex;align-items:center;justify-content:center;width:100%;height:34px;
  border-radius:var(--pph-r-ctl);border:0;background:var(--pph-surface2);
  color:var(--pph-ink);font-size:14px;font-weight:700;text-decoration:none;
  transition:background .12s;
}
.pph-drop-btn:hover{background:var(--pph-surface3);color:var(--pph-ink)}
.pph-drop-btn.is-discord{background:#5865f2;border-color:#5865f2;color:#fff}
.pph-drop-btn.is-discord:hover{background:#6a76f3;border-color:#6a76f3;color:#fff}
.pph-auth-or{
  display:flex;align-items:center;gap:10px;color:var(--pph-faint);font-size:12px;margin:10px 0;
}
.pph-auth-or::before,.pph-auth-or::after{content:"";flex:1;height:1px;background:var(--pph-border)}
.pph-auth-foot{margin:10px 0 0;font-size:12px;color:var(--pph-muted);text-align:center}
.pph-auth-foot a{color:var(--pph-accent);text-decoration:none;font-weight:700}

/* ── auth: signed in — avatar button + the v6 account panel ────────────── */
.pph-acct{position:relative;display:flex;align-items:center}
.pph-acct-btn{
  display:flex;align-items:center;gap:7px;background:none;border:0;padding:2px;
  cursor:pointer;color:#f0f0f0;border-radius:999px;
}
.pph-acct-btn:hover{color:var(--pph-accent)}
.pph-av{width:32px;height:32px;border-radius:999px;display:block;flex:none;
       border:1px solid var(--pph-border);background:var(--pph-surface2);object-fit:cover}
.pph-av-fallback{display:grid;place-items:center;font-weight:800;color:var(--pph-accent)}
.pph-cv{transition:transform .18s}
.pph-acct[data-open] .pph-cv{transform:rotate(180deg)}

.pph-acct-panel{
  position:absolute;right:0;top:calc(100% + 9px);width:262px;z-index:120;
  background:var(--pph-surface);border:0;border-radius:var(--pph-r-panel);
  overflow:hidden;box-shadow:0 22px 50px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s,transform .18s,visibility 0s linear .18s;
}
.pph-acct[data-open] .pph-acct-panel{
  opacity:1;visibility:visible;transform:translateY(0);
  transition:opacity .18s,transform .18s,visibility 0s;
}
.pph-acct-panel[hidden]{display:none}

.pph-acct-head{
  display:flex;align-items:center;gap:10px;padding:13px 14px;
  background:var(--pph-surface2);border-bottom:1px solid var(--pph-border);
  text-decoration:none;
}
a.pph-acct-head:hover .pph-acct-name{color:var(--pph-accent)}
.pph-acct-id{display:flex;flex-direction:column;min-width:0}
.pph-acct-name{font-weight:700;color:var(--pph-ink);font-size:14px;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  display:flex;align-items:center;gap:5px}
.pph-acct-handle{font-size:12px;color:var(--pph-faint);font-family:var(--pph-mono)}
.pph-verified{width:14px;height:14px;border-radius:999px;background:var(--pph-accent);color:var(--pph-on-accent);
  display:grid;place-items:center;font-size:11px;font-weight:900;line-height:1;flex:none}

.pph-acct-stats{display:flex;border-bottom:1px solid var(--pph-border)}

.pph-acct-stats > div{flex:1 1 auto;min-width:0;padding:9px 10px;display:flex;flex-direction:column;gap:1px}
.pph-acct-stats > div + div{border-left:1px solid var(--pph-border)}
.pph-stat-k{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--pph-muted);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pph-stat-v{font-family:var(--pph-mono);font-weight:700;
  font-size:14px;line-height:1.25;font-variant-numeric:tabular-nums;color:var(--pph-ink)}
.pph-stat-none{color:var(--pph-faint)}

/* rows with the v6 status dots */
.pph-acct-menu{padding:6px;display:flex;flex-direction:column;position:static}
.pph-acct-menu a{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--pph-r-ctl);
  color:var(--pph-ink);text-decoration:none;font-size:14px}
.pph-acct-menu a:hover{background:color-mix(in srgb,var(--pph-accent) 9%,transparent);color:var(--pph-ink)}
.pph-dot{width:7px;height:7px;border-radius:999px;background:var(--pph-accent);flex:none}
.pph-dot.is-muted{background:var(--pph-muted)}
.pph-acct-sep{height:1px;background:var(--pph-border);margin:5px 4px}
.pph-acct-out{color:var(--pph-muted) !important}

/* a row that is not a link yet — reads as unavailable, not broken */
.pph-acct-soon{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--pph-r-ctl);
  color:var(--pph-faint);font-size:14px;cursor:default}
.pph-acct-soon .pph-dot{background:var(--pph-faint);opacity:.6}
.pph-acct-soon em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.09em;color:var(--pph-faint)}

@media (max-width:1060px){
  :root{--pph-logo-h:var(--pph-logo-h-mobile)}
  .pph-top{--head-h:74px}
  .pph-top-in{gap:10px}
  .pph-lead{display:flex;flex:1 1 0;min-width:0}
  .pph-right{flex:1 1 0;justify-content:flex-end}
  .pph-nav{display:none}
  .pph-rail-in{grid-template-columns:repeat(2,1fr);height:50px}
  .pph-cell-set{display:none}
}
@media (max-width:700px){
  
  .pph-rail-in{display:flex;justify-content:space-between;align-items:center;height:48px;gap:12px}
  .pph-cell-steam{display:none}
  
  .pph-cell-date{padding:0;min-width:0;flex:0 1 auto}
  
  .pph-cell-tools,
  .pph-cell + .pph-cell-tools{display:flex;gap:9px;flex:none;padding:0;border-left:0;align-items:center}
  .pph-cell-tools::before{
    content:"";width:1px;height:22px;background:var(--pph-seam);
    margin-right:5px; /* + the 9px gap = 14px off the seam, like a cell pad */
  }
}

@media (prefers-reduced-motion:reduce){
  .pph-rail *,.pph-drawer,.pph-scrim,.pph-acct-panel,.pph-auth-drop,.pph-cv,.pph-dchev svg{
    animation:none !important;transition:none !important;
  }
}

.pph-consent,.pph-cmodal,.pph-open-consent{
  --pph-cs-surface:var(--pp-surface);--pph-cs-surface2:var(--pp-surface2);
  --pph-cs-surface3:var(--pp-surface3);--pph-cs-border:var(--pp-border);
  --pph-cs-ink:var(--pp-ink);--pph-cs-muted:var(--pp-muted);--pph-cs-accent:var(--pp-accent);
  --pph-cs-accent-hi:var(--pp-accent-hi);--pph-cs-on-accent:var(--pp-on-accent);
}

.pph-consent[hidden]{display:none}
.pph-consent{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  background:var(--pph-cs-surface);border-top:1px solid var(--pph-cs-border);
  box-shadow:0 -8px 24px rgba(0,0,0,.18);
  animation:pph-consent-in .3s ease-out;
}
@keyframes pph-consent-in{from{transform:translateY(10px);opacity:0}}
.pph-consent-in{
  max-width:1200px;margin:0 auto;padding:13px 20px;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
.pph-consent-txt{flex:1 1 340px;margin:0;font-size:14px;line-height:1.5;color:var(--pph-cs-ink)}
.pph-consent-txt a{color:var(--pph-cs-accent);text-decoration:none}
.pph-consent-txt a:hover{color:var(--pph-cs-accent-hi);text-decoration:underline}
.pph-consent-act{display:flex;gap:10px;flex:none;margin-left:auto}
@media (max-width:700px){
  .pph-consent-act{flex:1 1 100%;margin-left:0}
  .pph-consent-act .pph-cbtn{flex:1}
}

.pph-cbtn,.pph-open-consent{
  display:inline-flex;align-items:center;justify-content:center;
  box-sizing:border-box;height:34px;padding:0 16px;margin:0;
  border-radius:var(--pph-r-ctl);cursor:pointer;box-shadow:none;
  font-family:inherit;font-size:14px;font-weight:700;line-height:1;
  text-transform:none;letter-spacing:normal;text-decoration:none;
  background:var(--pph-cs-surface2);color:var(--pph-cs-ink);
  
  border:1px solid transparent;
  transition:background .12s ease-out,color .12s ease-out;
}

.pph-cbtn.pph-cbtn:hover,.pph-cbtn.pph-cbtn:focus,
.pph-open-consent.pph-open-consent:hover,.pph-open-consent.pph-open-consent:focus{
  background:var(--pph-cs-surface3);border-color:transparent;
  color:var(--pph-cs-ink);box-shadow:none;
}
.pph-cbtn:focus-visible,.pph-open-consent:focus-visible{
  outline:2px solid var(--pph-cs-accent);outline-offset:2px;
}

.pph-cbtn-primary.pph-cbtn-primary{background:var(--pph-cs-accent);color:var(--pph-cs-on-accent);border-color:transparent}
.pph-cbtn-primary.pph-cbtn-primary:hover,.pph-cbtn-primary.pph-cbtn-primary:focus{
  background:var(--pph-cs-accent-hi);border-color:transparent;color:var(--pph-cs-on-accent);
}

.pph-cmodal{position:fixed;inset:0;z-index:130;display:grid;place-items:center;padding:20px}
.pph-cmodal[hidden]{display:none}
.pph-cmodal-scrim{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.pph-cmodal-box{
  position:relative;width:min(100%,440px);max-height:min(86vh,560px);overflow:auto;
  background:var(--pph-cs-surface);border:1px solid var(--pph-cs-border);
  border-radius:var(--pph-r-panel);box-shadow:0 18px 50px rgba(0,0,0,.35);
  animation:pph-consent-in .18s ease-out;
}
.pph-cmodal-h{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 14px;border-bottom:1px solid var(--pph-cs-border);
}
.pph-ck{
  font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;color:var(--pph-cs-muted);
}
.pph-cmodal-x{width:30px;height:30px;padding:0;border-radius:var(--pph-r-ctl);color:var(--pph-cs-muted)}
.pph-cmodal-x .tsi{font-size:calc(12px * .92)}
.pph-crow{display:flex;gap:12px;align-items:flex-start;padding:13px 14px}
.pph-crow + .pph-crow{border-top:1px solid var(--pph-cs-border)}
.pph-crow-main{flex:1}
.pph-crow-name{font-size:14px;font-weight:700;color:var(--pph-cs-ink);margin:0 0 3px}
.pph-crow-desc{font-size:12px;color:var(--pph-cs-muted);margin:0;line-height:1.5}
.pph-crow-state{
  flex:none;padding-top:3px;font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.09em;color:var(--pph-cs-muted);
}
.pph-crow-state.is-on{color:var(--pph-cs-accent)}

.pph-ctog{
  flex:none;box-sizing:border-box;position:relative;
  width:40px;height:22px;padding:0;margin:0;border:none;
  border-radius:0;cursor:pointer;box-shadow:none;appearance:none;
  background:var(--pph-cs-surface2);
  transition:background .14s ease-out;
}
.pph-ctog-k{
  position:absolute;top:3px;left:3px;width:16px;height:16px;
  border-radius:0;background:var(--pph-cs-muted);
  transition:transform .14s ease-out,background .14s ease-out;
}
.pph-ctog:hover,.pph-ctog:focus{background:var(--pph-cs-surface3)}
.pph-ctog:hover .pph-ctog-k{background:var(--pph-cs-ink)}
.pph-ctog[aria-checked="true"]{background:var(--pph-cs-accent)}
.pph-ctog[aria-checked="true"]:hover,.pph-ctog[aria-checked="true"]:focus{
  background:var(--pph-cs-accent-hi);
}
.pph-ctog[aria-checked="true"] .pph-ctog-k{
  transform:translateX(18px);background:var(--pph-cs-on-accent);
}
.pph-ctog:focus-visible{outline:2px solid var(--pph-cs-accent);outline-offset:2px}
.pph-cmodal-f{
  display:flex;align-items:center;gap:10px;
  padding:13px 14px;border-top:1px solid var(--pph-cs-border);
}
.pph-cmodal-link{margin-right:auto;font-size:12px;color:var(--pph-cs-muted);text-decoration:none}
.pph-cmodal-link:hover{color:var(--pph-cs-accent);text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  .pph-consent,.pph-cmodal-box{animation:none}
  .pph-cbtn,.pph-open-consent{transition:none}
  .pph-ctog,.pph-ctog-k{transition:none}
}

@media (pointer: coarse) {
  .pph-burger,
  .pph-right .search-icon, .pph-cell-tools .search-icon,
  .pph-right .scheme-switcher .toggle, .pph-cell-tools .scheme-switcher .toggle,
  .pph-drawer-close, .pph-auth-btn, .pph-drop-btn { min-width: 44px; min-height: 44px; }
  .pph-dmenu a { padding: 15px 12px; }
  .pph-acct-menu a, .pph-acct-soon { padding: 12px 10px; }
}


/* GPC confirmation inside the cookie panel. */
.pph-cgpc {
	margin: 0;
	padding: 10px 12px;
	font-size: 12px;
	line-height: 1.5;
	color: var(--pph-fg-2, #b9bec7);
	background: var(--pph-surface, #1e2027);
	border-radius: 5px;
}
