/* Daily streak card on the player profile (owner, 2026-10-03). Data: me.php?streak=1 (own) and profile_get.php
 * (other players), drawn by js/profile-streak-20261003.js. Same photo-backed surface and padding steps as its
 * neighbours .pf-overview / .pf-workspace (css/profile-photo-20260912.css, which wins over profile-layout's
 * charcoal box); gold only for SWGC amounts, ice for progress. */
#pStreak, #pStreak * { box-sizing: border-box; letter-spacing: 0; }
#pStreak[hidden] { display: none !important; }
#pStreak {
  grid-column: 1 / -1; min-width: 0; margin-top: 24px; padding: 30px 32px 28px;
  border: 0; border-radius: 0; box-shadow: none; background-color: #07131d;
  background-image: linear-gradient(90deg, #030c16e6 0%, #040d18b8 52%, #090918a3 100%), url('/assets/hero-brand-20260911/worlds.webp');
  background-position: center, right center; background-size: cover; background-repeat: no-repeat;
  color: #e6edf1; font: 400 14px/22px Inter, system-ui, sans-serif;
}
#pStreak .pfs-head { display: flex; align-items: center; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; margin: 0 0 20px; }
#pStreak .pfs-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
#pStreak .pfs-title svg { flex: none; width: 22px; height: 22px; color: #b4dfe7; }
#pStreak h2 { margin: 0; padding: 0; font: 650 20px/28px Inter, system-ui, sans-serif; color: #f1f7fa; text-transform: none; text-shadow: none; }
#pStreak .pfs-public { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 2px 10px; border: 1px solid #c3d8e12b; border-radius: 999px;
  background: #0b1116a6; color: #aab8c2; font: 500 12px/20px Inter, system-ui, sans-serif; }
#pStreak .pfs-public svg { width: 14px; height: 14px; }

/* reward paid / verify notices */
#pStreak .pfs-note { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; padding: 12px 14px; border-radius: 8px; font: 500 13px/20px Inter, system-ui, sans-serif; }
#pStreak .pfs-note[hidden] { display: none !important; }
#pStreak .pfs-note--paid { border: 1px solid #d1ad5873; background: linear-gradient(90deg, #f3c56a1f, #f3c56a0a); color: #f6e3b4; }
#pStreak .pfs-note--paid b { color: #f3c56a; font-weight: 700; }
#pStreak .pfs-note--verify { border: 1px solid #c3d8e12b; background: #0b1116a6; color: #c8d5dc; }
#pStreak .pfs-note--verify a { color: #b4dfe7; text-decoration: underline; text-underline-offset: 2px; }
#pStreak .pfs-note .pfs-coin { flex: none; width: 28px; height: 28px; background: url("/assets/sweden-coin-20261007b/emblem.webp") center / contain no-repeat; }
#pStreak .pfs-note span { flex: 1; min-width: 0; }
#pStreak .pfs-note button { flex: none; min-height: 36px; min-width: 64px; margin: 0; padding: 0 14px; border: 1px solid #d1ad58; border-radius: 7px;
  background: #f7cf7014 !important; color: #f3c56a !important; cursor: pointer; clip-path: none !important; box-shadow: none !important;
  font: 600 13px/20px Inter, system-ui, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; }
#pStreak .pfs-note button:hover { background: #f7cf7026 !important; }

/* main row: big count | this week | totals */
#pStreak .pfs-main { display: grid; grid-template-columns: 210px minmax(0, 1fr) 236px; gap: 24px; align-items: stretch; }
#pStreak .pfs-count { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding-right: 24px; border-right: 1px solid #c3d8e124; }
#pStreak .pfs-count .pfs-num { display: flex; align-items: baseline; gap: 8px; font: 700 52px/1 Inter, system-ui, sans-serif; color: #f1f7fa; font-variant-numeric: tabular-nums; }
#pStreak .pfs-count .pfs-num small { font: 600 14px/20px Inter, system-ui, sans-serif; color: #aab8c2; white-space: nowrap; }
#pStreak.is-on .pfs-count .pfs-num { color: #ffffff; text-shadow: 0 0 22px #b4dfe740; }
#pStreak .pfs-status { display: flex; align-items: center; gap: 7px; margin-top: 12px; font: 500 13px/20px Inter, system-ui, sans-serif; color: #aab8c2; }
#pStreak .pfs-status i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #5d6d77; }
#pStreak .pfs-status.is-today { color: #8fe0b5; }
#pStreak .pfs-status.is-today i { background: #46d6a0; box-shadow: 0 0 0 3px #46d6a026; }
#pStreak .pfs-status.is-warn { color: #f0d08a; }
#pStreak .pfs-status.is-warn i { background: #f3c56a; }

#pStreak .pfs-week { min-width: 0; display: flex; flex-direction: column; justify-content: center; }
#pStreak .pfs-label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 10px; font: 600 13px/20px Inter, system-ui, sans-serif; color: #dfe8ed; }
#pStreak .pfs-label span:last-child { font-weight: 500; color: #aab8c2; font-variant-numeric: tabular-nums; }
#pStreak .pfs-track { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
#pStreak .pfs-seg { position: relative; display: grid; place-items: center; height: 44px; border: 1px solid #c3d8e124; border-radius: 7px; background: #0b1116a6;
  color: #6f8089; font: 600 12px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
#pStreak .pfs-seg.is-on { border-color: #b4dfe78c; background: linear-gradient(180deg, #b4dfe742, #b4dfe71a); color: #f1f7fa; box-shadow: inset 0 1px 0 #ffffff2e; }
#pStreak .pfs-seg.is-next { border-style: dashed; border-color: #b4dfe766; color: #b4dfe7; }
#pStreak .pfs-seg--prize { border-color: #d1ad5866; background: linear-gradient(180deg, #f3c56a24, #f3c56a0d); color: #f3c56a; }
#pStreak .pfs-seg--prize.is-on { border-color: #f3c56acc; background: linear-gradient(180deg, #f3c56a5c, #f3c56a24); color: #fff3d1; }
#pStreak .pfs-seg--prize .pfs-seg-coin { width: 18px; height: 18px; background: url("/assets/sweden-coin-20261007b/emblem.webp") center / contain no-repeat; }
#pStreak .pfs-next { margin: 12px 0 0; font: 500 13px/20px Inter, system-ui, sans-serif; color: #aab8c2; }
#pStreak .pfs-next b { color: #f3c56a; font-weight: 700; }

#pStreak .pfs-totals { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; min-width: 0; padding-left: 24px; border-left: 1px solid #c3d8e124; }
#pStreak .pfs-tot { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-width: 0; }
#pStreak .pfs-tot .k { font: 500 12px/18px Inter, system-ui, sans-serif; color: #a8b8c4; }
#pStreak .pfs-tot .v { font: 650 18px/26px Inter, system-ui, sans-serif; color: #f1f7fa; font-variant-numeric: tabular-nums; white-space: nowrap; }
#pStreak .pfs-tot .v.is-coin { color: #f3c56a; }
#pStreak .pfs-tot .v small { font-size: 11px; font-weight: 600; color: #baa374; }

/* lower row: calendar | reward log */
#pStreak .pfs-lower { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 24px 32px; margin-top: 24px; padding-top: 20px; border-top: 1px solid #c3d8e124; }
#pStreak h3 { margin: 0 0 12px; padding: 0; font: 600 14px/22px Inter, system-ui, sans-serif; color: #dfe8ed; text-transform: none; }
/* Monday-first grid: 4 full weeks + this week; days after today are dashed */
#pStreak .pfs-wd, #pStreak .pfs-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
#pStreak .pfs-wd { margin-bottom: 6px; }
#pStreak .pfs-wd li { font: 600 11px/16px Inter, system-ui, sans-serif; color: #7f909a; text-align: center; }
#pStreak .pfs-day { display: grid; place-items: center; height: 34px; min-width: 0; border-radius: 6px; background: #c3d8e10d; border: 1px solid #c3d8e114;
  color: #7a8b95; font: 500 12px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
#pStreak .pfs-day.is-on { background: linear-gradient(180deg, #c4e8ee, #96c9d3); border-color: #def3f6; color: #0b1418; font-weight: 650; }
#pStreak .pfs-day.is-today { outline: 2px solid #f1f7fa; outline-offset: 2px; }
#pStreak .pfs-day.is-future { background: transparent; border: 1px dashed #c3d8e12e; color: #6f7f88; }
#pStreak .pfs-cal-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; font: 500 12px/18px Inter, system-ui, sans-serif; color: #93a5b0; }
#pStreak .pfs-legend { display: flex; align-items: center; gap: 14px; }
#pStreak .pfs-legend span { display: inline-flex; align-items: center; gap: 6px; }
#pStreak .pfs-legend i { width: 10px; height: 10px; border-radius: 3px; background: #c3d8e10d; border: 1px solid #c3d8e124; }
#pStreak .pfs-legend i.is-on { background: #aed9e1; border-color: #def3f6; }

#pStreak .pfs-log { min-width: 0; padding-left: 32px; border-left: 1px solid #c3d8e124; }
#pStreak .pfs-log ol { margin: 0; padding: 0; list-style: none; max-height: 262px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #62747e transparent; }
#pStreak .pfs-log li { display: grid; grid-template-columns: minmax(84px, auto) minmax(0, 1fr) auto; align-items: baseline; gap: 4px 16px; padding: 10px 0; }
#pStreak .pfs-log li + li { border-top: 1px solid #c3d8e114; }
#pStreak .pfs-log .w { font: 600 13px/20px Inter, system-ui, sans-serif; color: #e6edf1; white-space: nowrap; }
#pStreak .pfs-log .d { min-width: 0; font: 400 12px/20px Inter, system-ui, sans-serif; color: #93a5b0; }
#pStreak .pfs-log .a { font: 700 13px/20px Inter, system-ui, sans-serif; color: #f3c56a; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
#pStreak .pfs-empty { margin: 0; color: #a5b7c2; font: 400 13px/20px Inter, system-ui, sans-serif; }

/* rules */
#pStreak .pfs-rules { margin-top: 20px; padding: 14px 16px; border: 1px solid #c3d8e11f; border-radius: 8px; background: #0b1116a6; }
#pStreak .pfs-rules h3 { margin-bottom: 8px; }
#pStreak .pfs-rules ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 24px; margin: 0; padding: 0; list-style: none; }
#pStreak .pfs-rules li { position: relative; padding-left: 16px; font: 400 13px/20px Inter, system-ui, sans-serif; color: #b9c6ce; }
#pStreak .pfs-rules li::before { content: ""; position: absolute; left: 2px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: #b4dfe7; }
#pStreak .pfs-rules b { color: #f3c56a; font-weight: 700; }

@media (max-width: 980px) {
  #pStreak .pfs-main { grid-template-columns: 180px minmax(0, 1fr); }
  #pStreak .pfs-totals { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 16px 0 0; border-left: 0; border-top: 1px solid #c3d8e124; }
  #pStreak .pfs-tot { flex-direction: column; align-items: flex-start; gap: 2px; }
  #pStreak .pfs-lower { grid-template-columns: minmax(0, 1fr); }
  #pStreak .pfs-calwrap { max-width: 460px; }
  #pStreak .pfs-log { padding: 20px 0 0; border-left: 0; border-top: 1px solid #c3d8e124; }
}
@media (max-width: 760px) {
  #pStreak .pfs-count { padding-right: 20px; }
  #pStreak .pfs-rules ul { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  #pStreak .pfs-count .pfs-num small { white-space: normal; }
  #pStreak .pfs-main { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  #pStreak .pfs-count { padding: 0 0 16px; border-right: 0; border-bottom: 1px solid #c3d8e124; }
  #pStreak .pfs-count .pfs-num { font-size: 44px; }
  #pStreak .pfs-seg { height: 40px; }
  #pStreak .pfs-totals { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  #pStreak .pfs-tot .v { font-size: 16px; }
  #pStreak .pfs-day { height: 38px; }
  #pStreak .pfs-log li { grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto; gap: 4px 10px; }
  #pStreak .pfs-note { flex-wrap: wrap; }
  #pStreak .pfs-note button { width: 100%; }
}
/* the neighbours' padding steps (profile-photo-20260912.css: 860px -> 26px, 600px -> 22px 20px) */
@media (max-width: 860px) { #pStreak { padding: 26px; } }
@media (max-width: 600px) { #pStreak { padding: 22px 20px; } }
@media (max-width: 400px) {
  #pStreak .pfs-totals { gap: 8px; }
  #pStreak .pfs-tot .v { font-size: 14px; line-height: 20px; white-space: normal; overflow-wrap: anywhere; }
}
#pStreak .pfs-log ol:focus-visible { outline: 2px solid #b4dfe7; outline-offset: 2px; }
#pStreak h2:focus { outline: none; }
#pStreak .pfs-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }