/* KPMG · App da plateia · v2 (refinado)
   Paleta: KPMG Blue #00338D · Cobalt #1E49E2 · Pacific #00B8F5 · Light Blue #ACEAFF · Dark Blue #0C233C · Purple #7213EA · Pink #FD349C */
:root {
  --kblue:#00338D; --cobalt:#1E49E2; --pacific:#00B8F5; --light:#ACEAFF; --dark:#0C233C; --purple:#7213EA; --pink:#FD349C;
  --g1: linear-gradient(90deg, var(--purple), var(--cobalt));
  --bg: #F5F7FC; --card: #FFFFFF; --line: #E1E8F5; --soft: #EEF3FD; --muted: #52618A;
  --fd: "KPMG Bold", "KPMG", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --ft: "Univers", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --r: 18px; --r-sm: 14px;
  --pad: 20px;
  --st: env(safe-area-inset-top, 0px); --sb: env(safe-area-inset-bottom, 0px);
  --bar-h: 60px; --dock-h: 68px;
  --shadow: 0 1px 2px rgba(12,35,60,.05), 0 6px 20px rgba(12,35,60,.06);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
[hidden]:not(#dock) { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; background: var(--bg); color: var(--kblue); font-family: var(--ft); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; color: inherit; }
button { -webkit-user-select: none; user-select: none; touch-action: manipulation; }
#app { min-height: 100dvh; display: flex; flex-direction: column; }
.ico { width: 20px; height: 20px; flex: none; }

/* ---------------- barra superior ---------------- */
#bar { position: sticky; top: 0; z-index: 20; height: calc(var(--bar-h) + var(--st)); padding: var(--st) var(--pad) 0; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: rgba(255,255,255,.92); -webkit-backdrop-filter: saturate(180%) blur(16px); backdrop-filter: saturate(180%) blur(16px); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; height: 22px; flex: none; }
.brand i { width: 1px; height: 100%; background: #C9D5EC; }
.logo { height: 22px; width: auto; }
.logo-txt { font-family: var(--fd); font-weight: 700; font-size: 20px; line-height: 1; letter-spacing: -.01em; color: var(--kblue); }
.logo-txt.sabesp-logo { font-family: var(--ft); font-weight: 700; text-transform: lowercase; font-size: 19px; }
.bar-r { display: flex; align-items: center; gap: 8px; }
.pillbtn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px 0 11px; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: var(--kblue); font-size: 14px; font-weight: 700; cursor: pointer; transition: background .2s, border-color .2s; }
.pillbtn .ico { width: 18px; height: 18px; color: var(--cobalt); }
.pillbtn.on { background: var(--kblue); border-color: var(--kblue); color: #fff; } .pillbtn.on .ico { color: var(--light); }
.net { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 999px; background: #FFF1F7; color: #A3104A; font-size: 12px; font-weight: 700; }
.net i { width: 7px; height: 7px; border-radius: 50%; background: var(--pink); animation: blink 1.2s infinite; }
@keyframes blink { 50% { opacity: .3; } }
:focus-visible { outline: 3px solid var(--pacific); outline-offset: 2px; }

/* ---------------- telas ---------------- */
#screens { flex: 1; position: relative; }
.screen { width: 100%; max-width: 560px; margin: 0 auto; padding: 22px var(--pad) calc(var(--dock-h) + 36px + var(--sb)); will-change: opacity, transform; }
body.no-dock .screen { padding-bottom: calc(28px + var(--sb)); }
.stack > * + * { margin-top: 14px; }
.screen > .stack + .stack { margin-top: 20px; }

/* ---------------- tipografia ---------------- */
.eyebrow { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--cobalt); }
.eyebrow .no { font-family: var(--fd); font-size: 15px; letter-spacing: 0; color: var(--pacific); }
.eyebrow .rule { width: 22px; height: 3px; border-radius: 2px; background: var(--g1); }
h1, h2 { font-family: var(--fd); font-weight: 700; margin: 0; letter-spacing: -.015em; text-wrap: balance; }
h1 { font-size: clamp(28px, 7.6vw, 36px); line-height: 1.08; }
h2 { font-size: clamp(22px, 6vw, 27px); line-height: 1.16; }
.head h2 { margin-top: 10px; }
p { margin: 0; font-size: 16px; line-height: 1.5; }
.muted { color: var(--muted); }
.small { font-size: 14px; }
.center { text-align: center; }

/* ---------------- blocos ---------------- */
.hero { position: relative; overflow: hidden; isolation: isolate; border-radius: 24px; padding: 24px 22px; background: var(--kblue); color: #fff; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 90% at 100% 110%, rgba(30,73,226,.95), transparent 60%), radial-gradient(70% 70% at 110% -10%, rgba(114,19,234,.4), transparent 70%); }
.hero .eyebrow { color: var(--light); }
.hero h1, .hero h2 { margin-top: 12px; }
.hero p { margin-top: 12px; color: #DCE6FF; font-size: 15.5px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; box-shadow: var(--shadow); }
.card-h { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--cobalt); margin-bottom: 12px; }
.list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.list li { display: flex; gap: 12px; font-size: 15.5px; line-height: 1.45; }
.list li::before { content: ""; width: 7px; height: 7px; margin-top: 8px; flex: none; border-radius: 50%; background: var(--pacific); }
.feat { display: grid; gap: 10px; }
.feat > div { display: flex; gap: 14px; align-items: center; padding: 14px; border-radius: var(--r-sm); background: var(--card); border: 1px solid var(--line); }
.feat .ic { width: 42px; height: 42px; flex: none; border-radius: 12px; display: grid; place-items: center; background: var(--soft); color: var(--cobalt); }
.feat b { display: block; font-size: 15.5px; } .feat span { display: block; font-size: 13.5px; line-height: 1.4; color: var(--muted); margin-top: 2px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--card); color: var(--kblue); font-size: 14px; font-weight: 700; }
button.chip { cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
button.chip:active { transform: scale(.97); }
.chip.on { background: var(--kblue); border-color: var(--kblue); color: #fff; }

/* ---------------- botões ---------------- */
.btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; padding: 0 20px; border-radius: var(--r-sm); border: 1px solid transparent; background: var(--cobalt); color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; transition: transform .12s ease, background .2s, opacity .2s; }
.btn:active { transform: scale(.98); }
.btn[disabled] { background: #B9C7E8; cursor: not-allowed; transform: none; }
.btn.sec { background: var(--card); color: var(--kblue); border-color: var(--line); }
.btn.sec .ico { color: var(--cobalt); }
.btn.text { background: transparent; color: var(--cobalt); min-height: 44px; }
.btn .ico { width: 20px; height: 20px; }
.fine { font-size: 12.5px; line-height: 1.5; color: var(--muted); text-align: center; }

/* ---------------- onboarding ---------------- */
.consent { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: var(--r-sm); background: var(--card); border: 1px solid var(--line); font-size: 14px; line-height: 1.5; cursor: pointer; transition: border-color .2s; }
.consent:has(input:checked) { border-color: var(--cobalt); background: #F7F9FF; }
.consent input { appearance: none; -webkit-appearance: none; width: 22px; height: 22px; margin: 0; flex: none; border-radius: 7px; border: 2px solid #A9B9DC; display: grid; place-items: center; transition: all .15s; }
.consent input:checked { background: var(--cobalt); border-color: var(--cobalt); }
.consent input:checked::after { content: ""; width: 6px; height: 11px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: translateY(-1px) rotate(45deg); }
.consent a { color: var(--cobalt); font-weight: 700; text-underline-offset: 2px; }

/* ---------------- lobby ---------------- */
.pond-wrap { display: grid; justify-items: center; gap: 10px; padding: 8px 0 4px; }
.pond { position: relative; width: 168px; height: 168px; border-radius: 50%; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, var(--cobalt), var(--kblue)); box-shadow: 0 0 0 6px #fff, 0 0 0 8px var(--light), 0 14px 34px rgba(0,51,141,.22); cursor: pointer; }
.pond::before, .pond::after { content: ""; position: absolute; left: -50%; width: 200%; height: 200%; top: 50%; border-radius: 42%; background: rgba(0,184,245,.5); animation: spin 10s linear infinite; }
.pond::after { top: 56%; background: rgba(172,234,255,.28); animation-duration: 14s; }
@keyframes spin { to { transform: rotate(360deg); } }
.pond .rp { position: absolute; z-index: 2; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; border: 2px solid rgba(255,255,255,.9); animation: ripple 1.2s ease-out forwards; pointer-events: none; }
@keyframes ripple { from { transform: scale(.2); opacity: 1; } to { transform: scale(5); opacity: 0; } }
.pond-cap { font-size: 13px; color: var(--muted); }

/* ---------------- palestrantes / conteúdo ---------------- */
.people { display: grid; gap: 14px; }
.spk { display: flex; align-items: center; gap: 14px; }
.spk .ph { position: relative; width: 56px; height: 56px; flex: none; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: linear-gradient(135deg, var(--cobalt), var(--kblue)); color: #fff; font-family: var(--fd); font-size: 19px; }
.spk .ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.spk b { display: block; font-size: 16px; } .spk small { display: block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--cobalt); margin-top: 3px; }
.steps4 { display: grid; gap: 14px; }
.steps4 > div { display: flex; gap: 14px; align-items: flex-start; }
.steps4 .n { width: 30px; flex: none; font-family: var(--fd); font-size: 20px; color: var(--pacific); line-height: 1.2; }
.steps4 b { display: block; font-size: 16px; } .steps4 span { display: block; font-size: 14px; line-height: 1.4; color: var(--muted); margin-top: 2px; }

/* ---------------- votação ---------------- */
.opts { display: grid; gap: 10px; }
.opt { position: relative; isolation: isolate; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 12px 14px; border-radius: var(--r-sm); border: 1.5px solid var(--line); background: var(--card); text-align: left; color: var(--kblue); cursor: pointer; overflow: hidden; transition: border-color .2s, transform .12s ease; }
.opt:active { transform: scale(.985); }
.opt .fill { position: absolute; inset: 0 auto 0 0; z-index: -1; width: 0; background: var(--soft); transition: width .8s cubic-bezier(.2,.7,.2,1); }
.opt .k { width: 28px; height: 28px; flex: none; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid #C9D5EC; background: #fff; font-size: 13px; font-weight: 700; color: var(--cobalt); transition: background .2s, border-color .2s, color .2s; }
.opt .t { flex: 1; min-width: 0; font-size: 16px; font-weight: 700; line-height: 1.3; }
.opt .p { flex: none; font-family: var(--fd); font-size: 17px; font-variant-numeric: tabular-nums; opacity: 0; transition: opacity .3s; }
.opts.has .opt .p { opacity: 1; }
.opt.mine { border-color: var(--cobalt); }
.opt.mine .k { background: var(--cobalt); border-color: var(--cobalt); color: #fff; }
.opt.mine .fill { background: rgba(30,73,226,.13); }
.opt.lead .p { color: var(--cobalt); }
.vnote { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 14px; border-radius: var(--r-sm); background: var(--soft); font-size: 14px; color: var(--muted); }
.vnote .ico { width: 18px; height: 18px; color: var(--cobalt); }
.vnote.done { background: #E9F8F1; color: #0B6B45; } .vnote.done .ico { color: #0E8A57; }
.vnote b { color: inherit; }

/* ---------------- ideias ---------------- */
.idea { display: flex; gap: 8px; }
.idea input { flex: 1; min-width: 0; height: 52px; padding: 0 16px; border-radius: var(--r-sm); border: 1.5px solid var(--line); background: #fff; font-size: 16px; color: var(--kblue); }
.idea input::placeholder { color: #8C9ABA; }
.idea input:focus { outline: none; border-color: var(--cobalt); }
.idea .btn { width: auto; flex: none; padding: 0 18px; }
.sent { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sent li { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px; border-radius: var(--r-sm); background: var(--soft); font-weight: 700; font-size: 15px; }
.sent li .ico { color: var(--cobalt); width: 18px; height: 18px; }
.sent li span::first-letter { text-transform: uppercase; }
.left { font-size: 13px; color: var(--muted); }

/* ---------------- doca de reações ---------------- */
#dock { position: fixed; z-index: 30; left: 50%; bottom: calc(10px + var(--sb)); width: min(520px, calc(100% - 20px)); height: var(--dock-h); transform: translateX(-50%); display: grid; grid-template-columns: repeat(6, 1fr); gap: 2px; padding: 6px; border-radius: 22px; background: var(--kblue); box-shadow: 0 10px 30px rgba(0,30,90,.28); transition: opacity .25s, transform .25s; }
#dock[hidden] { display: grid; opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(20px); }
.rx { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 0; padding: 0 2px; border: 0; border-radius: 16px; background: transparent; color: #fff; cursor: pointer; transition: background .15s, transform .1s; }
.rx:active { transform: scale(.9); background: rgba(255,255,255,.14); }
.rx .ico { width: 24px; height: 24px; }
.rx small { font-size: 10.5px; font-weight: 700; line-height: 1; color: #CFE0FF; white-space: nowrap; }
.rx .cnt { position: absolute; top: 4px; right: calc(50% - 22px); min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--pacific); color: var(--dark); font-size: 10px; font-weight: 700; line-height: 17px; text-align: center; opacity: 0; transform: scale(.6); transition: opacity .2s, transform .2s; }
.rx .cnt.on { opacity: 1; transform: none; }
#fly { position: fixed; inset: 0; pointer-events: none; z-index: 40; overflow: hidden; }
.fl { position: absolute; width: 40px; height: 40px; margin: -20px 0 0 -20px; border-radius: 50%; display: grid; place-items: center; background: var(--cobalt); color: #fff; box-shadow: 0 6px 16px rgba(30,73,226,.4); will-change: transform, opacity; animation: fly 1s cubic-bezier(.2,.7,.2,1) forwards; }
.fl .ico { width: 22px; height: 22px; }
@keyframes fly { 0% { transform: translateY(0) scale(.5); opacity: 0; } 15% { transform: translateY(-10px) scale(1.1); opacity: 1; } 100% { transform: translate(var(--dx), -190px) scale(.8); opacity: 0; } }

/* ---------------- relatório ---------------- */
.score { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
.ring { position: relative; width: 96px; height: 96px; flex: none; }
.ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring circle { fill: none; stroke-width: 9; } .ring .tr { stroke: rgba(172,234,255,.22); } .ring .fl2 { stroke: var(--light); stroke-linecap: round; }
.ring b { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--fd); font-size: 28px; color: #fff; }
.band { font-family: var(--fd); font-size: 21px; line-height: 1.15; }
.score p { margin-top: 6px; font-size: 14px; }
.recs { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; counter-reset: r; }
.recs li { display: flex; gap: 12px; font-size: 15px; line-height: 1.45; }
.recs li::before { counter-increment: r; content: counter(r, decimal-leading-zero); width: 24px; flex: none; font-family: var(--fd); font-size: 16px; color: var(--pacific); }
.cmp { display: grid; }
.cmp .row { padding: 12px 0; border-top: 1px solid var(--line); } .cmp .row:first-child { border-top: 0; padding-top: 0; } .cmp .row:last-child { padding-bottom: 0; }
.cmp .q { font-size: 13px; line-height: 1.4; color: var(--muted); }
.cmp .a { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 4px; font-size: 15px; font-weight: 700; }
.cmp .a em { font-style: normal; font-size: 13px; color: var(--cobalt); white-space: nowrap; }
.cmp .bar2 { height: 6px; border-radius: 3px; background: var(--soft); margin-top: 8px; overflow: hidden; } .cmp .bar2 i { display: block; height: 100%; border-radius: 3px; background: var(--cobalt); }
.rxsum { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.rxsum div { display: grid; justify-items: center; gap: 2px; padding: 12px 6px; border-radius: var(--r-sm); background: var(--soft); text-align: center; }
.rxsum .ico { width: 20px; height: 20px; color: var(--cobalt); }
.rxsum b { font-family: var(--fd); font-size: 20px; line-height: 1.1; } .rxsum small { font-size: 11px; color: var(--muted); }
.cta { position: relative; overflow: hidden; isolation: isolate; display: block; padding: 22px 20px; border-radius: 22px; background: var(--g1); color: #fff; text-decoration: none; }
.cta::after { content: ""; position: absolute; z-index: -1; right: -60px; bottom: -90px; width: 220px; height: 220px; border-radius: 50%; background: rgba(172,234,255,.16); }
.cta small { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--light); }
.cta b { display: block; margin: 8px 0; font-family: var(--fd); font-size: 21px; line-height: 1.18; }
.cta span { display: block; font-size: 14px; line-height: 1.45; color: #E6EDFF; }
.cta em { display: inline-flex; align-items: center; gap: 8px; height: 44px; margin-top: 16px; padding: 0 18px; border-radius: 12px; background: #fff; color: var(--kblue); font-style: normal; font-size: 15px; font-weight: 700; }
.cta em .ico { width: 18px; height: 18px; color: var(--cobalt); }
.actions { display: grid; gap: 10px; }

/* ---------------- toast ---------------- */
#toast { position: fixed; left: 50%; top: calc(var(--bar-h) + var(--st) + 10px); z-index: 60; max-width: calc(100vw - 40px); padding: 11px 16px; border-radius: 12px; background: var(--dark); color: #fff; font-size: 14px; font-weight: 700; text-align: center; transform: translate(-50%, -8px); opacity: 0; transition: opacity .25s, transform .25s; pointer-events: none; }
#toast.on { opacity: 1; transform: translate(-50%, 0); }
#print { display: none; }

/* ---------------- telas largas / paisagem ---------------- */
@media (min-width: 700px) { .screen { padding-top: 32px; } }
@media (orientation: landscape) and (max-height: 520px) {
  :root { --bar-h: 50px; --dock-w: 74px; }
  .screen { max-width: none; padding: 16px calc(var(--dock-w) + 24px + env(safe-area-inset-right, 0px)) 24px calc(var(--pad) + env(safe-area-inset-left, 0px)); }
  body.no-dock .screen { padding-right: calc(var(--pad) + env(safe-area-inset-right, 0px)); max-width: 640px; }
  .screen.two { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0 24px; align-items: start; }
  .screen.two > .stack:first-child { position: sticky; top: calc(var(--bar-h) + 16px); }
  .screen.two > .stack + .stack { margin-top: 0; }
  #dock { left: auto; right: calc(10px + env(safe-area-inset-right, 0px)); top: calc(var(--bar-h) + 10px); bottom: calc(10px + var(--sb)); width: var(--dock-w); height: auto; transform: none; grid-template-columns: 1fr; grid-template-rows: repeat(6, 1fr); }
  #dock[hidden] { transform: translateX(20px); }
  .rx small { font-size: 9.5px; } .rx .ico { width: 21px; height: 21px; } .rx { gap: 3px; }
  .rx .cnt { top: 2px; right: 8px; }
  h1 { font-size: 26px; } h2 { font-size: 21px; }
  .hero { padding: 18px; } .pond { width: 120px; height: 120px; }
  .opt { min-height: 48px; padding: 9px 12px; } .opt .t { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01s !important; transition-duration: .01s !important; } }

/* ---------------- PDF (A4, 1 página) ---------------- */
@media print {
  @page { size: A4; margin: 12mm; }
  html, body { background: #fff !important; }
  #app, #fly, #toast { display: none !important; }
  #print { display: block; color: var(--kblue); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pr-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; border-bottom: 3px solid; border-image: var(--g1) 1; }
  .pr-head .logo-txt { font-size: 20px; } .pr-head small { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--cobalt); font-weight: 700; }
  .pr-hero { display: flex; gap: 18px; align-items: center; margin-top: 10px; padding: 14px 18px; border-radius: 14px; background: var(--kblue); color: #fff; break-inside: avoid; }
  .pr-hero .ring { width: 86px; height: 86px; } .pr-hero .ring b { font-size: 24px; }
  .pr-hero h1 { font-size: 22px; } .pr-hero .band { font-size: 18px; color: var(--light); margin-top: 4px; } .pr-hero p { font-size: 11px; color: #DCE6FF; margin-top: 4px; }
  .pr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
  .pr-sec { padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; break-inside: avoid; }
  .pr-sec .card-h { font-size: 9px; margin-bottom: 8px; }
  .pr-sec .recs { gap: 7px; } .pr-sec .recs li { font-size: 10.5px; } .pr-sec .recs li::before { font-size: 12px; }
  .pr-sec .cmp .row { padding: 5px 0; } .pr-sec .cmp .q { font-size: 9px; } .pr-sec .cmp .a { font-size: 10.5px; margin-top: 1px; } .pr-sec .cmp .a em { font-size: 9.5px; } .pr-sec .cmp .bar2 { height: 4px; margin-top: 4px; }
  .pr-sec .rxsum { gap: 5px; } .pr-sec .rxsum div { padding: 5px 4px; } .pr-sec .rxsum .ico { width: 15px; height: 15px; } .pr-sec .rxsum b { font-size: 15px; } .pr-sec .rxsum small { font-size: 8px; }
  .pr-sec .sent { display: flex; flex-wrap: wrap; gap: 6px; } .pr-sec .sent li { min-height: 0; padding: 5px 10px; font-size: 10.5px; }
  .pr-cta { margin-top: 10px; padding: 13px 16px; border-radius: 12px; background: var(--g1); color: #fff; break-inside: avoid; }
  .pr-cta b { display: block; font-family: var(--fd); font-size: 15px; } .pr-cta span { display: block; font-size: 10px; margin-top: 3px; } .pr-cta code { display: block; margin-top: 5px; font-family: var(--ft); font-size: 9px; color: var(--light); word-break: break-all; }
  .pr-foot { margin-top: 10px; font-size: 8px; line-height: 1.5; color: var(--muted); }
}

@media (max-width: 380px) { .net { width: 28px; padding: 0; justify-content: center; font-size: 0; } .net i { width: 8px; height: 8px; } }