/* POV brand layer, loaded last on every page. Minimal: one family (Geist), off-black and off-white,
   Rec Red only for what is live. Over video, controls are light glass so the world stays visible. */
.brand img { display: block; height: 16px; width: auto; }
.brand i { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Type: calm hierarchy by weight and size, never by shouting. */
h1, h2, h3, .sh-t, .gram-t, .nq-t, .f-t, .card .t, .gate h2, .gate-h, .subview-h h2, .apphead h1, h1#setup-h, .empty h1, .tile.att .t-bot b {
  font-family: var(--f-display) !important; font-stretch: 100% !important; font-weight: 600 !important; letter-spacing: -.03em !important; text-transform: none !important; }
h1 { line-height: 1.02; }
.stamp, .dotted { font-family: var(--f-ui); font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }

/* Labels: small and quiet. */
.qs-k, .qd-k, .m-state, .sect, .decision, .ask small, .kick, .step-k, .lab, .pl-k, .ql-h, .ql-k, .ql-next, .card .k, .eyebrow, .spm-k, .spm-d, .adbar .ad-by, .now i, .place, .t-place, .notif b, .empty .e-next .k, .lastpov small, .me .fc, .badge, .pc-state, .recog .rk, .recog .ra span, .rq .amt span, .rq .urgent, .rq .gk, .rq .trend, .rq .qspon, .tag, .demo-tag, .tabbar button, label.f, .row-item.loc small, .gram-l b, .shr-prog span, .nq-k, .edge, .rail, .p-chip {
  font-family: var(--f-ui) !important; font-stretch: 100% !important; letter-spacing: .02em !important; }
.qs-k, .qd-k, .m-state, .sect, .kick, .step-k, .pl-k, .ql-h, .ql-k, .card .k, .eyebrow, .spm-k, .empty .e-next .k, .lastpov small, .me .fc, .now i, .ask small, .gram-l b { color: var(--muted) !important; font-weight: 600 !important; font-size: 12px !important; }
.place { font-weight: 600 !important; font-size: 14px !important; letter-spacing: .01em !important; text-transform: none !important; }
.watching, .h-coins, .stat, .rq .amt b, .lrow .r, .bal b, .big-amt, .qd-o b, .fbar b, .tile .t-v, .tile .t-ago, .pc-dur, .stats b, .sum b, .res-stats b, .earn-hero b.big, .me-stats b, .ph-stamp, .gram6 b, .marks, .empty .e-badge, .empty .e-eyebrow, .empty .e-steps b, .creator-paused b, .f-k, .rq .pos, .rq.opt .letter {
  font-family: var(--f-ui) !important; font-weight: 600 !important; letter-spacing: 0 !important; font-variant-numeric: tabular-nums; }
.qd-o b, .rq .amt b, .lrow .r, .stat, .h-coins { color: var(--ink) !important; }
.stats b, .sum b, .res-stats b, .earn-hero b.big, .bal b, .big-amt { color: var(--ink) !important; }

/* LIVE: the only red on screen. */
.live-pill { font-family: var(--f-ui) !important; font-weight: 700 !important; letter-spacing: .06em !important; border-radius: 6px !important; color: #fff !important; padding: 0 8px !important; font-size: 11.5px !important; }
.live-pill .live-dot, .live-dot { background: #fff !important; }
.live-pill[data-pulse="HIGH"] { box-shadow: none; }

/* Progress: one smooth rounded line, no segments. */
.frames, .qs-bar, .ql-bar, .nq-bar, .qd-t, .goal { -webkit-mask-image: none !important; mask-image: none !important; border-radius: 999px !important; overflow: hidden; }
.qs-bar i, .ql-bar i, .qd-t i { border-radius: 999px; background: var(--ink) !important; }
.qs-bar { height: 3px !important; background: rgba(255,255,255,.18) !important; }

/* Light glass over video (web approximation of a frosted material, solid fallback below). */
.qs, .qd, .mission, .dock > button, .dock-say input, .dock-react, .h-explore, .h-coins, .qs-more, .spm, #h-ad, .recog, .fbar > span, .rq, .p-chip, .sound-hint, .empty .e-next, .empty .e-badge, .stat, .card, .ql, .strip, .cact .cact-q, .follow.icon, .follow.on, .notif, .toast, .feel {
  background: rgba(28, 28, 31, .42) !important; -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.1), inset 0 1px 0 rgba(255,255,255,.08) !important; }
.watching { background: none !important; box-shadow: none !important; padding: 0 !important; color: rgba(245,245,247,.85) !important; text-shadow: 0 1px 6px rgba(0,0,0,.5); font-size: 13px !important; }
.card, .ql, .notif, .toast { background: rgba(28, 28, 31, .72) !important; }
@media (prefers-reduced-transparency: reduce) { .qs, .qd, .mission, .dock > button, .dock-say input, .dock-react, .card, .ql { background: rgba(20,20,22,.94) !important; backdrop-filter: none; -webkit-backdrop-filter: none; } }

/* Shape: soft containers, pill controls. */
.qs, .qd, .rq, .mission, .spm, .recog, #h-ad, .card, .ql, .notif, .nq-card, .empty .e-next, .tile, .pc-media, .lastpov, .row-item, .ml, .pay-acct, .pl, .gate, .earn-hero, .mode, .home-glasses, .set-more, details.more, .stats, .sum, .res-stats, .gram-l, .gate-pts, .shr-card, .dest, .in, textarea.in, input.in, select.in, .qd-o, .tip-amts button, .coin-pks button, .gifts button { border-radius: var(--r-2) !important; }
.dock > button, .dock-say input, .dock-react, .h-explore, .h-coins, .qs .add, .qs .qs-buy, .rq .add, .follow, .cta, .chip, .pill, .ghost, .pc-share, .pc-more, .acts button, .cact button, .endbtn, .ql-start, .ql-more, .mission .yn button, .nq-go, .nq-yn button, .e-cta, .share-row, .pillbtn, .stat, .iconbtn, .avatar, .x, .qs-more, .spm-o a, .adbar .ad-cta, .notif #n-go, .quick button, .plat button.sm, .strip button { border-radius: 999px !important; }
.sheet { border-radius: 28px 28px 0 0 !important; }
.sheet .grab { border-radius: 999px !important; background: rgba(255,255,255,.22) !important; width: 36px !important; height: 5px !important; }

/* Actions: white primary, quiet secondary. Paid is never louder than free. */
.qs .add.vote, .rq .add, .cta, .follow, .dock .dock-main, .pc-share, .yes, .cact .cact-ask, .nq-go, .nq-yn button, .mission .yn button, .e-cta, .adbar .ad-cta, .notif #n-go { background: var(--ink) !important; color: var(--base) !important; }
.qs .qs-buy, .add.fund, .cta.accent, .ql-start { background: rgba(255,255,255,.12) !important; color: var(--ink) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18) !important; }
.nq-yn button[data-cf="0"], .mission .yn button[data-confirm="0"] { background: rgba(255,255,255,.12) !important; color: var(--ink) !important; }
.endbtn { background: var(--rec) !important; color: #fff !important; }
.cta, .qs .add, .follow, .dock > button, .chip, .pc-share { transition: transform .18s cubic-bezier(.16,1,.3,1), background .2s; }
.cta:active, .qs .add:active, .follow:active, .dock > button:active, .pc-share:active { transform: scale(.97); }

/* Choice: your vote gets a clean ring; the winner a fuller bar. */
.qd-o { box-shadow: inset 0 0 0 1px rgba(255,255,255,.14) !important; background: rgba(255,255,255,.06) !important; }
.qd-o.mine { box-shadow: inset 0 0 0 1.5px var(--ink) !important; }
.qd-o.mine::after { display: none !important; }
.qd-o i { background: rgba(255,255,255,.12) !important; }
.qd-o.win { box-shadow: inset 0 0 0 1.5px var(--ink) !important; } .qd-o.win i { background: rgba(255,255,255,.22) !important; }
.qd.qd-new { box-shadow: inset 0 0 0 1px rgba(255,255,255,.3), 0 20px 50px rgba(0,0,0,.45) !important; }
.qd.qd-new::before { background: var(--ink) !important; color: var(--base) !important; border-radius: 999px !important; font-family: var(--f-ui) !important; letter-spacing: .02em !important; padding: 4px 10px !important; }
.mission, .qs.ok, .rq.hot, .rq.lead, .mission.confirm { box-shadow: inset 0 0 0 1px rgba(255,255,255,.12) !important; }
.nq-card { box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 30px 80px rgba(0,0,0,.6) !important; background: rgba(28,28,31,.9) !important; backdrop-filter: blur(24px); }
.nq-k { background: rgba(255,255,255,.12) !important; color: var(--ink) !important; border-radius: 999px !important; padding: 5px 10px !important; }

/* Unlock moment: a soft white flash, then the result. */
@keyframes pov-flash { 0% { opacity: .55; } 100% { opacity: 0; } }
@keyframes pov-stamp-in { from { opacity: 0; transform: translateY(6px); } }
.flash::before { background: #fff !important; }
.f-k { background: rgba(28,28,31,.6) !important; color: var(--ink) !important; border-radius: 999px !important; padding: 6px 12px !important; font-size: 13px !important; backdrop-filter: blur(16px); }
.f-t { font-size: 34px !important; }
.f-s { background: none !important; padding: 0 !important; text-shadow: 0 1px 10px rgba(0,0,0,.6); }

/* Creator home: the record button, clean. */
.golive::after { display: none !important; }
.golive, .home-hero .golive, #go.golive { font-family: var(--f-ui) !important; font-stretch: 100% !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: -.01em !important; color: #fff !important;
  box-shadow: 0 0 0 6px var(--base), 0 0 0 8px rgba(255,255,255,.9), 0 30px 60px rgba(255,59,47,.22) !important; }
.tabbar { background: rgba(10,10,11,.8) !important; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.tabbar button { text-transform: none !important; font-size: 11.5px !important; font-weight: 500 !important; }
.tabbar button.on::before { display: none; }
.apphead { border-bottom: 0 !important; }
.row-item .lead { color: var(--ink) !important; border-radius: 12px !important; }
.portal { border-radius: 6px; border-width: 1.75px; }
.teleport { background: var(--base) !important; }
.t-ring { border-radius: 999px !important; border: 2px solid rgba(255,255,255,.2) !important; border-top-color: var(--ink) !important; width: 36px !important; height: 36px !important; animation: spin .8s linear infinite; }
.t-ring::before { display: none !important; }
.spin { border-radius: 50% !important; background: none !important; border: 2px solid rgba(255,255,255,.2) !important; border-top-color: var(--ink) !important; width: 22px !important; height: 22px !important; animation: spin .8s linear infinite !important; }
#stage.booting::after { animation: livepulse 1.6s ease-in-out infinite !important; filter: none !important; }

/* Nobody live landing */
.empty h1 { font-size: clamp(36px, 10vw, 56px) !important; line-height: 1 !important; }
.empty h1 em { color: var(--ink) !important; opacity: .55; }
.empty .e-steps { box-shadow: none !important; gap: 8px !important; }
.empty .e-steps li { border-radius: var(--r-2); background: rgba(28,28,31,.42) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.1) !important; backdrop-filter: blur(20px); }
.empty .e-steps li + li { box-shadow: inset 0 0 0 1px rgba(255,255,255,.1) !important; }
.empty .e-steps b { display: none; }
.empty .e-badge { color: var(--ink) !important; border-radius: 999px !important; padding: 0 12px !important; }
.empty .e-badge i { background: var(--rec) !important; }

/* ── POV voice: the logo's face for headlines, the camera's dot-matrix for live signals ── */
h1, h2, .f-t, .nq-t, .gate-h, .empty h1, .apphead h1, h1#setup-h, .subview-h h2, .card .t, .gate h2 {
  font-family: 'Archivo', 'Geist', system-ui, sans-serif !important; font-stretch: 125% !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: -.01em !important; line-height: .94 !important; }
.empty h1 { font-size: clamp(30px, 9vw, 52px) !important; }
.f-t { font-size: 28px !important; }
.live-pill, .stat#c-time, .watching, .h-coins, .rq .amt b, .qd-o b, .tile .t-live, .tile .t-v, .pc-dur, .creator-paused b, .empty .e-badge, .f-k, .qd-k, .qs-k {
  font-family: 'Doto', 'Geist', ui-monospace, monospace !important; font-weight: 900 !important; letter-spacing: .08em !important; }
.qd-k, .qs-k { font-size: 12.5px !important; color: rgba(245,245,247,.82) !important; }
.live-pill { font-size: 12.5px !important; }
/* Viewfinder: corner brackets frame what you are looking at */
.vf { position: relative; }
.vf::before { content: ''; position: absolute; inset: -16px; pointer-events: none; z-index: 3; --c: rgba(255,255,255,.85); --l: 26px; --w: 2px;
  background:
    linear-gradient(var(--c), var(--c)) top left / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) top left / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) top right / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) top right / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom left / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) bottom left / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom right / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) bottom right / var(--w) var(--l) no-repeat; }
.rec { display: inline-flex; align-items: center; gap: 8px; font-family: 'Doto', monospace; font-weight: 900; font-size: 15px; letter-spacing: .12em; color: #fff; }
.rec i { width: 9px; height: 9px; border-radius: 50%; background: var(--rec); box-shadow: 0 0 12px rgba(255,59,47,.9); animation: livepulse 1.2s steps(2, jump-none) infinite; }
.home-hero { position: relative; }
.home-hero::before { content: ''; position: absolute; left: 50%; top: 4px; width: 268px; height: 268px; margin-left: -134px; pointer-events: none; --c: rgba(255,255,255,.7); --l: 24px; --w: 2px;
  background:
    linear-gradient(var(--c), var(--c)) top left / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) top left / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) top right / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) top right / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom left / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) bottom left / var(--w) var(--l) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom right / var(--l) var(--w) no-repeat, linear-gradient(var(--c), var(--c)) bottom right / var(--w) var(--l) no-repeat; }
.golive, .home-hero .golive, #go.golive { font-family: 'Archivo', 'Geist', sans-serif !important; font-stretch: 125% !important; font-weight: 900 !important; font-size: 22px !important; line-height: 1 !important; text-transform: uppercase; }
.home-hero { gap: 30px !important; }
.home-hero::before { top: 6px !important; width: 252px !important; height: 252px !important; margin-left: -126px !important; }
.print.vf { width: min(380px, calc(100% - 32px)) !important; }
.print.vf::before { inset: -14px -14px; }
.qs-k, .qd-k { font-family: var(--f-ui) !important; font-weight: 600 !important; letter-spacing: .03em !important; font-size: 11.5px !important; }
.follow.icon { color: var(--ink) !important; }
/* No eyebrows above headings */
.empty .e-next .k { display: none !important; }
.qs .qs-buy { font-family: var(--f-ui) !important; font-weight: 600 !important; letter-spacing: 0 !important; }
.qs .qs-buy { gap: 6px !important; padding: 0 12px !important; } .qs .qs-buy svg { flex: none; }
/* Narrow phones: decision options never overflow; dock keeps the field readable */
.qd { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
.qd-o { min-width: 0; padding: 0 10px !important; }
.qd-o span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qd-o b { flex: none; font-size: 12px !important; }
@media (max-width: 380px) { .dock-react button { width: 27px !important; font-size: 15.5px !important; } .dock-say input { padding: 0 12px; font-size: 15px; } .qd-o { font-size: 13px !important; } }
/* Quest strip: the Quest reads in full, actions sit compact underneath */
.qs { flex-wrap: wrap !important; row-gap: 10px !important; column-gap: 8px !important; padding: 12px 12px 16px 14px !important; }
.qs-main { flex: 1 1 100% !important; }
.qs-t { white-space: normal !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 15px !important; line-height: 1.25 !important; }
.qs-k { white-space: normal !important; }
.qs .add, .qs .qs-buy { height: 34px !important; padding: 0 14px !important; font-size: 13px !important; }
.qs .qs-buy { gap: 5px !important; }
/* One bottom panel language: Quest strip and Quick Decision share padding, radius, label and title styles */
.qd { padding: 12px 12px 14px 14px !important; row-gap: 8px !important; border-radius: var(--r-2) !important; }
.qd-k, .qs-k, .m-state { font-family: var(--f-ui) !important; font-size: 11.5px !important; font-weight: 600 !important; letter-spacing: .03em !important; color: rgba(245,245,247,.72) !important; text-transform: uppercase; }
.qd-q, .qs-t, .m-text { font-family: var(--f-ui) !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.25 !important; letter-spacing: -.01em !important; }
.qd-f { font-size: 12px !important; color: var(--muted) !important; }
.m-state i { display: none; }

/* ── Uniform rules across every screen ──
   Type: Archivo Expanded = screen and page titles only. Geist = everything else.
   Doto = live signals only (LIVE, REC, watching count, live timer). Numbers elsewhere are Geist, tabular. */
.stats b, .sum b, .res-stats b, .earn-hero b.big, .me-stats b, .bal b, .big-amt, .rq .amt b, .qd-o b, .h-coins, .tile .t-v, .tile .t-ago, .pc-dur, .creator-paused b, .empty .e-badge, .f-k, .fbar b, .lrow .r, .gram6 b, .tile .v, .fc, .grid span, .ov .k .tag, .step small, .ph-stamp {
  font-family: var(--f-ui) !important; font-weight: 600 !important; letter-spacing: 0 !important; font-variant-numeric: tabular-nums; }
.live-pill, .rec, .watching, .stat#c-time, .tile .t-live { font-family: 'Doto', ui-monospace, monospace !important; font-weight: 900 !important; letter-spacing: .08em !important; }
.f-k, .empty .e-badge, .ov .k .tag { text-transform: uppercase; letter-spacing: .04em !important; font-size: 12px !important; }
/* Shape: pills for controls, 16px for panels and cards, 24px for media frames, 28px for sheets. */
:root { --r-2: 16px; }

/* Internal tools (admin, debug, quests, campaigns, audience, egress): same system, denser */
[data-internal] { font-family: var(--f-ui); }
[data-internal] header, [data-internal] .top { gap: 10px; }
[data-internal] button:not(.live-pill), [data-internal] .btn, [data-internal] a.btn { border-radius: 999px !important; font-family: var(--f-ui); font-weight: 600; }
[data-internal] input, [data-internal] select, [data-internal] textarea { border-radius: 12px !important; border: 0 !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14) !important; background: var(--base) !important; color: var(--ink) !important; font-family: var(--f-ui); }
[data-internal] input:focus, [data-internal] select:focus, [data-internal] textarea:focus { box-shadow: inset 0 0 0 1.5px var(--ink) !important; outline: none; }
[data-internal] table { border-collapse: collapse; font-variant-numeric: tabular-nums; }
[data-internal] th { font-family: var(--f-ui) !important; font-size: 11.5px !important; font-weight: 600 !important; letter-spacing: .03em !important; color: var(--muted) !important; text-transform: uppercase; }
[data-internal] td, [data-internal] th { border-color: rgba(255,255,255,.08) !important; }
[data-internal] .card, [data-internal] .tile, [data-internal] .box, [data-internal] .panel, [data-internal] section > div[class] { border-radius: 16px; }
[data-internal] header b, [data-internal] .top b { color: var(--ink) !important; font-family: 'Archivo', var(--f-ui) !important; font-stretch: 125% !important; font-weight: 900 !important; letter-spacing: 0 !important; text-transform: uppercase; }
/* Share your best moment: a full screen, not a half sheet over GO LIVE. Clip, status and destinations fit without scrolling. */
.sheet:has(.shr) { top: 0; max-height: none !important; height: 100%; max-width: none; border-radius: 0 !important; padding-top: calc(16px + env(safe-area-inset-top)) !important; background: var(--base) !important; }
.sheet:has(.shr) .grab { display: none; }
.shr { gap: 16px !important; }
.shr-card { width: min(56vw, 240px) !important; }
.shr-prog { border-radius: 999px !important; }
.dest { border-radius: 16px !important; }
