/* feet 11.11. (Tokens MVP, lib/fp2_tokens.php): /account/tokens/, the Tokens block of the order card, her Get paid block, the
   shop page's packages, the admin screen. Member tokens (tonal surfaces, the accent, no card edges), 44 px targets, 16 px
   fields; phones first, the two-column grid from 1000 px. */

.tkn__grid{display:grid;gap:16px}
@media (min-width:1000px){.tkn__grid{grid-template-columns:minmax(0,1fr) 320px;align-items:start}}
.tkn-bal__n{display:flex;align-items:baseline;gap:10px;margin:4px 0 0}
.tkn-bal__n b{font:800 32px/1.1 var(--font-sans);letter-spacing:-.02em;color:var(--ink)}
.tkn-bal__n span{font:600 15px/1.3 var(--font-sans);color:var(--ink-2)}
.tkn-bal__n--in b{font-size:26px}
.tkn-bal .pc-sub{display:flex;align-items:center;gap:6px;margin-top:8px}

/* the packages: three tiles, the picked one lit */
.tkn-packs{display:grid;gap:10px;margin:14px 0 12px;padding:0;list-style:none}
@media (min-width:640px){.tkn-packs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tkn-pack{display:grid;gap:4px;padding:16px;border-radius:16px;background:var(--surface-2);text-align:center}
.tkn-pack.is-pick{background:color-mix(in srgb,var(--accent) 14%,var(--surface-2));box-shadow:inset 0 0 0 2px var(--accent)}
.tkn-pack__n{font:800 22px/1.2 var(--font-sans);color:var(--ink)}
.tkn-pack__price{font:700 17px/1.3 var(--font-sans);color:var(--ink)}
.tkn-pack__price{margin-bottom:8px}
.tkn-pack form{display:contents}
.tkn-pack .pc-btn{min-height:44px;justify-self:stretch;width:100%}
.tkn-pack .pc-btn.is-off{opacity:.55;pointer-events:none}
.tkn-soon{display:block;position:relative;margin:16px 0 0;padding:14px 14px 14px 42px;border-radius:14px;background:var(--surface-2);color:var(--ink)}   /* night 1000 guest: the title was a narrow flex column of three lines beside the text */
.tkn-soon .pc-ico{position:absolute;left:14px;top:16px;color:var(--ink-2)}
.tkn-soon b{display:block;font:700 15px/1.3 var(--font-sans)}
.tkn-soon p{margin:4px 0 0;font:500 14px/1.45 var(--font-sans);color:var(--ink-2)}
.tkn-test{display:flex;gap:6px;align-items:flex-start;margin:10px 0 0}

/* history rows and the open purchase */
.tkn-rows{display:grid;gap:0;margin:8px 0 0;padding:0;list-style:none}
.tkn-rows--in{margin-top:14px}
.tkn-row{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 0;border-top:1px solid color-mix(in srgb,var(--ink) 10%,transparent)}
.tkn-row:first-child{border-top:0}
.tkn-row__t{display:grid;gap:2px;min-width:0;flex:1 1 auto}
.tkn-row__t b{font:600 15px/1.3 var(--font-sans);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tkn-row__t small{font:500 13px/1.3 var(--font-sans);color:var(--ink-2)}
.tkn-row__n{flex:none;font:700 15px/1.3 var(--font-sans);color:var(--ink-2);font-variant-numeric:tabular-nums}
.tkn-row__n.is-plus{color:var(--ok,#3ddc97)}
.tkn-row__n.is-hold{color:var(--ink)}

/* how it works (the rail) */
.tkn-how__steps{margin:8px 0 12px;padding-left:20px;display:grid;gap:8px;font:500 14px/1.45 var(--font-sans);color:var(--ink-2)}
.tkn-how .fp-ro__safe{margin-top:8px}

/* her Get paid block */
.tkn-cr{margin-top:16px}
.tkn-cr__kyc{display:flex;gap:6px;align-items:flex-start;margin:12px 0 4px}
.tkn-cr__kyc .pc-ico{flex:none;margin-top:2px}
.tkn-cr__row{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 0;border-top:1px solid color-mix(in srgb,var(--ink) 10%,transparent)}
.tkn-cr__row .pc-btn{flex:none}
.tkn-switch{flex:none;position:relative;width:52px;height:32px;padding:0;border:0;border-radius:16px;background:color-mix(in srgb,var(--ink) 22%,transparent);cursor:pointer;transition:background .15s}
.tkn-switch[aria-checked="true"]{background:var(--accent)}
.tkn-switch__knob,.tkn-switch .pc-switch__knob{position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .15s}
.tkn-switch[aria-checked="true"] .pc-switch__knob{transform:translateX(20px)}
.tkn-switch:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* the order card's Tokens block */
.tkn-pay{display:grid;gap:6px;margin:10px 0 2px;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--accent) 10%,var(--surface-2))}
.tkn-pay--again{background:transparent;padding:0;margin-top:4px}
.tkn-pay__or{margin:0;font:600 13px/1.3 var(--font-sans);color:var(--ink-2)}
.tkn-pay form{display:grid;gap:6px}
.tkn-pay__btn{min-height:44px;width:100%;justify-content:center}
.tkn-pay__short{display:flex;gap:6px;align-items:flex-start;margin:0;font:500 14px/1.45 var(--font-sans);color:var(--ink)}
.tkn-pay__short .pc-ico{flex:none;margin-top:2px;color:var(--ink-2)}
.tkn-pay .pc-help{margin:0}
.tkn-keys{margin-top:8px}
.tkn-prob{margin-top:4px}

/* the shop page */
.tkn-packs--shop{margin:20px 0 0}
.tkn-packs--shop .tkn-pack{padding:22px 18px}
.tkn-steps{counter-reset:none}
@media (min-width: 701px){.pn-slf-steps.tkn-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}   /* night 1000 guest: three steps filled three of four columns */
.tkn-step__n{display:inline-grid;place-items:center;width:32px;height:32px;margin-bottom:8px;border-radius:50%;background:var(--accent);color:#fff;font:800 15px/1 var(--font-sans)}

/* the admin screen */
.tkn-adm-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tkn-adm-f{display:inline-flex;gap:4px;align-items:center;margin:0}
.tkn-adm-cents{width:110px;min-height:36px;font-size:14px}
tr.is-disputed td{background:color-mix(in srgb,#ff5a5a 12%,transparent)}

/* home narrative 11.11.: the three steps carry the portal's stickers (lib/portal_feet.php pnew_fp_obj) for a guest in the look */
.tkn-step__obj{display:block;width:72px;height:72px;margin-bottom:8px;object-fit:contain}

/* night 1000 (buyer b): the closed packages say so in a plain label (no key that looks tappable, no lit «pick»); on phones a
   package is one row (count + price left, the label right) instead of three tall tiles; the rail's protection line keeps its
   icon apart (pnew-requests.css is not loaded here); the answers panel under the history */
.tkn-pack__soon{display:block;min-height:24px;font:600 14px/1.4 var(--font-sans);color:var(--ink-2)}
@media (max-width:639px){
  .tkn-pack{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 12px;text-align:left;padding:14px 16px}
  .tkn-packs--shop .tkn-pack{padding:14px 16px}
  .tkn-pack__n{font-size:19px}
  .tkn-pack__price{grid-row:2;margin:0;font-size:15px;color:var(--ink-2)}
  .tkn-pack__soon{grid-column:2;grid-row:1/span 2;min-height:0}
  .tkn-pack:has(form) .tkn-pack__price{margin-bottom:6px}
  .tkn-pack:has(form) :is(form,.pc-btn){grid-column:1/-1}
}
.tkn-how .fp-ro__safe{display:flex;align-items:flex-start;gap:8px;margin:8px 0 0;padding:10px 12px;border-radius:12px;background:var(--surface-2);color:var(--ink-2);font:500 14px/1.45 var(--font-sans)}
.tkn-how .fp-ro__safe .pc-ico{flex:none;margin-top:2px}
.tkn-faq .pn-faq{margin:8px -8px 0}
/* the shop page's «open soon» note: icon, then the head over its line (was three squeezed columns) */
.tkn-shop-pg .tkn-soon{max-width:720px}
.tkn-shop-pg .tkn-soon p{margin:4px 0 0}
/* night 1000 (creator-money #30): the page wrapper carries .fp-tl (the tools pages' rhythm), and portal-look.css styles the
   home's .fp-tl bands (a lighter band, padding 0 at the sides, !important) — the Credits page sat flush on a band. The page is
   no home band. */
body.pc-root .pn-wide.fp-tl.tkn{background:transparent!important;color:inherit;padding:0 0 var(--space-8,40px)!important;overflow:visible}
body.pc-root .tkn > .pn-panel.fp-rqp--in{padding:20px!important;border-radius:20px}
@media (min-width:760px){body.pc-root .tkn > .pn-panel.fp-rqp--in{padding:24px 28px!important}}
body.pc-root .tkn > .pn-panel.fp-rqp--in > .tkn-cr{margin-top:0}
/* night 1000 (creator-money #31 / #32): her rows' titles wrap («Require Credits for first-time buy…» was cut at 390 px), and
   on phones the payout key sits under its text (the text ran five lines beside a wide key) */
.tkn-cr__row .tkn-row__t b{white-space:normal;overflow:visible}
@media (max-width:520px){.tkn-cr__row:has(> .pc-btn){flex-wrap:wrap}.tkn-cr__row > .pc-btn{flex:1 1 100%}}
.pn-slf-faq__next { margin: var(--space-6, 24px) 0 0; }   /* night 1000 guest: the guest next step under the credits FAQ */

/* ==== 12.11. wallet flow (lane FAN, lib/fp2_wallet_fan.php): the accept-and-send sheet, the fan's order card, the waiting
   screen, the fan wallet. The one dialog look (fp-system.css §12) frames the sheet; here its inside. One blue key, tonal
   surfaces, no edges, 44 px targets, numbers in tabular figures. */
body.pc-root dialog.wf-sheet{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 48px);margin:auto;padding:0;overflow-y:auto;overscroll-behavior:contain}
body.pc-root dialog.wf-sheet:not([open]){display:none}
@media (max-width:899.98px){body.pc-root dialog.wf-sheet{width:100vw;max-width:100vw;max-height:92dvh;margin:auto 0 0;border-radius:20px 20px 0 0}}
.wf-sheet__top{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:12px;padding:18px 16px 6px 24px;background:inherit}
.wf-sheet__body{display:grid;gap:12px;padding:0 24px 24px}
.wf-sheet__lede{margin:0;font:400 15px/1.5 "Inter",var(--font-sans),sans-serif}
.wf-sheet__wallet,.wf-sheet__warn{display:flex;gap:10px;align-items:flex-start;margin:0;padding:12px 14px;border-radius:14px;background:var(--surface-2);font:600 15px/1.45 "Inter",var(--font-sans),sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.wf-sheet__wallet .pc-ico,.wf-sheet__warn .pc-ico{flex:none;margin-top:2px;color:var(--accent)}
.wf-sheet__warn .pc-ico{color:var(--ink-2)}
.wf-sheet__label{margin:4px 0 0;padding:0;font:650 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wf-packs{display:grid;gap:8px;margin:0;padding:0;border:0;min-width:0}
.wf-pack{position:relative;display:flex;align-items:center;gap:12px;min-height:52px;padding:0 16px;border-radius:14px;background:var(--surface-2);cursor:pointer;font-variant-numeric:tabular-nums}
.wf-pack input{position:absolute;opacity:0;pointer-events:none}
.wf-pack::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:var(--surface,#fff);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ink) 30%,transparent)}
.wf-pack:has(input:checked){background:color-mix(in srgb,var(--accent) 12%,var(--surface-2));box-shadow:inset 0 0 0 2px var(--accent)}
.wf-pack:has(input:checked)::before{box-shadow:inset 0 0 0 6px var(--accent)}
.wf-pack:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.wf-pack.is-off{cursor:not-allowed;color:var(--ink-2)}
.wf-pack.is-off::before{opacity:.4}
.wf-pack__n{flex:1;font:650 16px/1.3 "Inter",var(--font-sans),sans-serif;color:inherit}
.wf-pack__p{font:600 15px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-sheet__left{margin:0;font:500 14px/1.45 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-rails{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.wf-rails .pc-btn{min-height:48px;justify-content:center}
.wf-sheet__fine{margin:0;font:400 13px/1.45 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-err{margin:0;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,#d93025 10%,var(--surface-2));color:var(--ink);font:600 14px/1.4 "Inter",var(--font-sans),sans-serif}
.wf-err[hidden]{display:none}
.wf-sheet--confirm .wf-sheet__body{gap:14px}

/* the offer card: the request's time left, her methods folded, the one key */
.wf-left{display:flex;align-items:center;gap:8px;margin:8px 0 0;font:600 14px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.wf-left .pc-ico{color:var(--accent)}
.wf-left.is-ended,.wf-left.is-ended .pc-ico{color:var(--ink-2)}
.wf-other{margin:8px 0 0}
.wf-other summary{display:inline-flex;align-items:center;min-height:44px;font:600 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2);cursor:pointer}
.wf-other[open] summary{color:var(--ink)}
.wf-accept{min-height:48px}

/* the fan's order card */
.wf-card{display:grid;gap:10px;margin:10px 0 2px}
.wf-card__when{display:flex;align-items:center;gap:8px;margin:0;padding:10px 14px;border-radius:14px;background:var(--surface-2);font:600 14px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wf-card__when .pc-ico{color:var(--accent)}
.wf-card--late .wf-card__when .pc-ico{color:var(--ink-2)}
.wf-card__link{margin:0}
.wf-card .tkn-keys .pc-btn{min-height:44px}

/* the waiting screen */
.wf-wait{display:grid;justify-items:center;gap:14px;max-width:520px;margin:24px auto;padding:32px 24px;border-radius:20px;background:var(--surface-2);text-align:center}
.wf-wait__ico{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:var(--accent)}
.wf-wait.is-done .wf-wait__ico{background:color-mix(in srgb,#1f9d6b 16%,var(--surface));color:#16855a}
.wf-wait h1{margin:0;font:650 22px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wf-wait p{margin:0;max-width:40ch;font:500 15px/1.5 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-wait [data-wf-line]{color:var(--ink);font-weight:600}
.wf-wait__spin{width:20px;height:20px;border-radius:50%;border:3px solid color-mix(in srgb,var(--accent) 22%,transparent);border-top-color:var(--accent);animation:wfspin 1s linear infinite}
.wf-wait:is(.is-done,.is-slow,.is-ended) .wf-wait__spin{display:none}
@keyframes wfspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wf-wait__spin{animation:none}}

/* the fan wallet (switch wf_wallet): one 640 px column, tonal cards, no edges, no rules between rows */
.wfw{max-width:640px;margin-inline:auto}
.wfw-card{display:grid;gap:12px;margin:0 0 16px;padding:20px;border-radius:20px;background:var(--surface,#fff)}
.wfw-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wfw-bal__n{margin:0;font:750 40px/1.1 "Inter",var(--font-sans),sans-serif;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.wfw-bal__sub{margin:-4px 0 4px;font:600 15px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink-2);font-variant-numeric:tabular-nums}
.wfw-top{justify-self:start;min-height:48px}
@media (max-width:599.98px){.wfw-top{justify-self:stretch;justify-content:center}}
.wfw-bal__trust{display:flex;gap:8px;align-items:flex-start;margin:0;font:500 14px/1.45 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wfw-bal__trust .pc-ico{flex:none;margin-top:2px;color:var(--accent)}
.wfw-h{margin:0;font:650 17px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wfw-day{margin:8px 0 0;font:600 13px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wfw-rows{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.wfw-row{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 12px;border-radius:14px;background:var(--surface-2);color:var(--ink);text-decoration:none}
.wfw-row--link:hover{background:var(--surface-3,var(--surface-2))}
.wfw-row--link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wfw-row__t{display:grid;gap:2px;flex:1 1 auto;min-width:0}
.wfw-row__t b{font:600 15px/1.3 "Inter",var(--font-sans),sans-serif;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.wfw-row__t small{font:500 13px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wfw-row__n{flex:none;font:650 15px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.wfw-row__n.is-plus{color:#16855a}
.wfw-row__n.is-quiet{color:var(--ink-2);font-weight:500}
.wfw-test{color:var(--ink-2)}
.wfw-thumb{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:12px;overflow:hidden;background:var(--surface-3,var(--surface));color:var(--ink-2)}
.wfw-thumb img{width:100%;height:100%;object-fit:cover}
.wfw-more{justify-self:center}
.wfw-empty p{margin:0;color:var(--ink-2)}
.wfw-empty .pc-btn{justify-self:start}
.wfw-help__links{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0}
.wfw-help__links a{display:inline-flex;align-items:center;min-height:44px;font:600 15px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--accent)}
.wfw-rc__dl{display:grid;gap:6px;margin:0}
.wfw-rc__dl div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.wfw-rc__dl dt{color:var(--ink-2);font:500 14px/1.4 "Inter",var(--font-sans),sans-serif}
.wfw-rc__dl dd{margin:0;font:600 14px/1.4 "Inter",var(--font-sans),sans-serif;text-align:right;font-variant-numeric:tabular-nums}
.wfw-rc__fine,.wfw-rc__co{margin:0;font:500 14px/1.5 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
@media print{.pc-band,.fp-shell,nav,header,footer,.wfw-print{display:none!important}.wfw-card{padding:0}}
/* the statement (owner 12.11. «a real ledger»): filters, rows with reference + running balance, a detail sheet per row */
.wfw-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.wfw-csv{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:600 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--accent)}
.wfw-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.wfw-filter .pc-input{min-height:44px;width:auto;flex:1 1 140px;border-radius:12px}
.wfw-filter .pc-btn{min-height:44px}
.wfw-clear{font:600 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wfw-none{margin:0;color:var(--ink-2)}
.wfw-line{list-style:none}
button.wfw-row{width:100%;border:0;text-align:left;font:inherit;cursor:pointer}
.wfw-row__n{display:grid;justify-items:end;gap:2px}
.wfw-row__n small{font:500 12px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wfw-amt{font:650 15px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wfw-amt.is-plus{color:#16855a}
.wfw-amt.is-quiet{color:var(--ink-2);font-weight:500}
/* 13.11. wallet P2 (lane FAN): tips (F8), the inline stars, the files viewer, the request form's Credits, 44 px targets (#494) */
.wf-err.is-ok{background:color-mix(in srgb,#1f9d6b 14%,var(--surface-2))}
.wf-tip__form{display:grid;gap:10px}
.wf-tip__chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0;padding:0;border:0;min-width:0}
.wf-tip__chips legend{grid-column:1/-1;margin-bottom:6px}
.wf-tip__chip{position:relative;display:grid;place-items:center;min-height:48px;padding:0 6px;border-radius:14px;background:var(--surface-2);cursor:pointer;text-align:center;font:650 15px/1.2 "Inter",var(--font-sans),sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.wf-tip__chip input{position:absolute;opacity:0;pointer-events:none}
.wf-tip__chip:has(input:checked){background:color-mix(in srgb,var(--accent) 14%,var(--surface-2));box-shadow:inset 0 0 0 2px var(--accent)}
.wf-tip__chip:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:379.98px){.wf-tip__chips{grid-template-columns:repeat(2,1fr)}}
.wf-tip__custom,.wf-tip__note{min-height:48px;border-radius:12px}
.wf-tip__sure{display:flex;gap:10px;align-items:center;min-height:44px;font:500 14px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wf-tip__sure[hidden],.wf-tip__rails[hidden],.wf-tip__send[hidden]{display:none}
.wf-tip__keys{display:grid;gap:10px}
.wf-tip__send{min-height:48px;justify-content:center}
.wf-card__tip,.wf-biotip{margin:0}
.wf-biotip{margin-top:10px}
.wf-card__tip .pc-btn,.wf-biotip .pc-btn{min-height:44px}
/* the stars: five radios, right to left so «this and the ones before it» light up with ~ (no script) */
.wf-rate{display:grid;gap:8px;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.wf-rate__set{margin:0;padding:0;border:0;min-width:0}
.wf-rate__stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px}
.wf-rate__stars label{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:color-mix(in srgb,var(--ink) 28%,transparent);cursor:pointer}
.wf-rate__stars input:checked~label,.wf-rate__stars label:hover,.wf-rate__stars label:hover~label{color:#e8a200}
.wf-rate__stars input:focus-visible+label{outline:2px solid var(--accent);outline-offset:1px}
.wf-rate .pc-input{min-height:44px;border-radius:12px}
.wf-rate .pc-btn{justify-self:start;min-height:44px}
/* his delivered files (#112 #113): two small keys on each tile, one full-screen viewer */
.fp-ro__clip{position:relative}
.fp-ro__fkeys{position:absolute;right:6px;bottom:6px;display:flex;gap:6px}
.fp-ro__fkey{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;cursor:pointer}
.fp-ro__fkey:focus-visible{outline:2px solid #fff;outline-offset:2px}
dialog.wf-view{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;background:#0b0b0d;color:#fff}
dialog.wf-view::backdrop{background:#0b0b0d}
.wf-view__stage{display:grid;place-items:center;width:100%;height:100%}
.wf-view__stage img,.wf-view__stage video{max-width:100%;max-height:100%;object-fit:contain}
.wf-view__x,.wf-view__nav{position:absolute;display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font:400 30px/1 "Inter",sans-serif;cursor:pointer}
.wf-view__x{top:12px;right:12px}
.wf-view__nav{top:50%;transform:translateY(-50%)}
.wf-view__nav--prev{left:12px}
.wf-view__nav--next{right:12px}
.wf-view__nav[hidden]{display:none}
.wf-view__save{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);min-height:44px}
/* the request form while Credits reach him (#252 #254) */
.fp-rn__unit{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font:600 15px/1 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.fp-rn__credits{display:flex;gap:8px;align-items:flex-start}
.fp-rn__credits .pc-ico{flex:none;margin-top:2px;color:var(--accent)}
/* the offer card (#240 #241 #243 #248), his offers (#239), the card number (#145), inbox chips (#137), phones (#142 #144) */
.wf-facts{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0 0;font:600 14px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.wf-facts span{display:inline-flex;align-items:center;gap:6px}
.wf-facts .pc-ico{color:var(--accent)}
.wf-above{margin:6px 0 0;font:500 14px/1.45 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-nfm{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:10px 0 0;padding:10px 14px;border-radius:14px;background:var(--surface-2);font:500 14px/1.4 "Inter",var(--font-sans),sans-serif;color:var(--ink-2)}
.wf-nfm .pc-btn,.wf-nfmk .pc-btn{min-height:44px}
.wf-nfmk{display:contents}
.wf-count{margin:0 0 8px;font:650 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink)}
.wf-card__no{margin:0;font:500 12px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--ink-2);font-variant-numeric:tabular-nums}
.wf-tchip{background:color-mix(in srgb,var(--accent) 14%,var(--surface-2));color:var(--ink)}
.fp-ro__top .fp-oc__title{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@media (max-width:599.98px){
  .wf-card>.tkn-keys{position:sticky;bottom:8px;z-index:1;padding:8px;margin:0 -8px;border-radius:16px;background:var(--surface,#fff)}
  .wf-card .tkn-keys .pc-btn{flex:1 1 auto;justify-content:center}
}
.wf-sheet .pc-btn,.wf-sheet .pc-input{min-height:44px}
.wfw-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin:0;padding:0;list-style:none}
.wfw-files .fp-ro__clip img,.wfw-files .fp-ro__clip video{width:100%;aspect-ratio:1;object-fit:cover;border-radius:14px;display:block}
.wfw-files__k{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;font:600 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--accent)}
.wfw-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin:0;padding:0;list-style:none}
.wfw-files .fp-ro__clip img,.wfw-files .fp-ro__clip video{width:100%;aspect-ratio:1;object-fit:cover;border-radius:14px;display:block}
.wfw-files__k{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;font:600 14px/1.3 "Inter",var(--font-sans),sans-serif;color:var(--accent)}
.wfw-rel{display:grid;gap:8px}
.wfw-rel summary{list-style:none;justify-self:start;min-height:44px;cursor:pointer}
.wfw-rel summary::-webkit-details-marker{display:none}
.wfw-rel form{display:grid;gap:8px;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.wfw-rel .pc-btn{justify-self:start;min-height:44px}