/* CamboPost Telegram Mini App V8.1 — visual polish, not a feature rewrite.
   Loaded AFTER V8. Preserves all JS/API, the 3-screen layout and brand assets.
   Design priorities: crisp text, balanced density, keyboard-safe dock. */

body.cpV8.cpNativeV5 {
  --nv-bg:#0b1120;
  --nv-panel:#171e32;
  --nv-elev:#232b42;
  --nv-input:#10182a;
  --nv-stroke:#343e59;
  --nv-dim:#b7c2db;
  --nv-soft:#97a4bd;
  --nv-shadow:rgba(5,9,26,.24);
}
body.cpV8.cpNativeV5[data-mini-theme="light"] {
  --nv-bg:#f5f6fb;
  --nv-panel:#ffffff;
  --nv-elev:#f1f3fb;
  --nv-input:#fafbff;
  --nv-stroke:#dbe1f0;
  --nv-dim:#69768e;
  --nv-soft:#808da5;
  --nv-shadow:rgba(43,55,102,.075);
}

/* Header: slightly less heavy, better logo balance, natural compact badge. */
body.cpV8.cpNativeV5 .cpMiniHeader.topbar {
  height:53px!important;
  min-height:53px!important;
  top:calc(8px + env(safe-area-inset-top,0px))!important;
  padding-inline:11px!important;
  border-radius:16px!important;
  box-shadow:0 9px 26px var(--nv-shadow),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body.cpV8.cpNativeV5 .cpHeaderMark {
  height:36px!important;width:36px!important;
  min-width:36px!important;flex-basis:36px!important;
}
body.cpV8.cpNativeV5 .cpHeaderWordmark>strong {
  font-size:15px!important;
}
body.cpV8.cpNativeV5 .cpHeaderWordmark>small {
  font-size:8px!important;letter-spacing:1.15px!important;
}
body.cpV8.cpNativeV5 .cpMiniThemeToggle {
  width:33px!important;height:33px!important;
  border-radius:10px!important;
}
body.cpV8.cpNativeV5 .cpMiniSession {
  padding:6px 8px!important;
  min-height:28px!important;
  font-size:9.5px!important;
  border-radius:9px!important;
}

/* Consistent breathing room without pulling the CTA below the fold. */
body.cpV8.cpNativeV5 .cpLaunchScreen {
  gap:10px!important;
}
body.cpV8.cpNativeV5 .cpMiniScroll.content {
  padding-top:calc(74px + env(safe-area-inset-top,0px))!important;
  padding-bottom:calc(95px + env(safe-area-inset-bottom,0px))!important;
}
body.cpV8.cpNativeV5 .cpNativeWelcome.cpV8Welcome {
  min-height:163px!important;
  padding:13px 16px 0!important;
  border-radius:20px!important;
  box-shadow:0 14px 35px var(--nv-shadow),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body.cpV8.cpNativeV5 .cpV8Topline {
  font-size:9px!important;
  letter-spacing:1.12px!important;
}
body.cpV8.cpNativeV5 .cpV8Welcome .cpNativeWelcomeRow {
  min-height:94px!important;
}
body.cpV8.cpNativeV5 .cpV8HeroCopy h1 {
  font-size:clamp(26px,7vw,32px)!important;
  line-height:1.07!important;
  letter-spacing:-.95px!important;
  margin-bottom:7px!important;
}
body.cpV8.cpNativeV5 .cpV8HeroCopy p {
  font-size:11px!important;
  line-height:1.43!important;
}
body.cpV8.cpNativeV5 .cpV8HeroSteps {
  gap:7px!important;
  min-height:29px!important;
  padding:7px 0!important;
  font-size:9.5px!important;
}
body.cpV8.cpNativeV5 .cpV8ArtSpark {
  background:#80dce6!important;
  box-shadow:0 0 0 4px rgba(122,225,236,.12),0 0 15px rgba(114,229,225,.40)!important;
}

/* Composer: less empty space, stronger hierarchy and readable input. */
body.cpV8.cpNativeV5 .cpLaunchScreen .panel.cpCreatorSourceCard {
  border-radius:17px!important;
  box-shadow:0 8px 24px var(--nv-shadow),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
body.cpV8.cpNativeV5 .cpLaunchScreen .cpV8SourceTitle.cpCardTitle {
  min-height:63px!important;
  padding:12px 13px 9px!important;
  gap:10px!important;
}
body.cpV8.cpNativeV5 .cpV8SourceTitle h2 {
  font-size:16.5px!important;
  letter-spacing:-.35px!important;
}
body.cpV8.cpNativeV5 .cpV8SourceTitle p {
  font-size:10.5px!important;
}
body.cpV8.cpNativeV5 .cpV8Overline {
  font-size:9px!important;
  letter-spacing:.9px!important;
}
body.cpV8.cpNativeV5 .cpV8SourceTitle .cpStepChip {
  color:var(--nv-dim)!important;
  font-size:9px!important;
}
body.cpV8.cpNativeV5 .cpLaunchScreen .cpCreatorSourceCard .cpCardBody {
  gap:9px!important;
  padding:0 13px 13px!important;
}
body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpCreatorUrlField {
  height:49px!important;
  min-height:49px!important;
  border-radius:12px!important;
}
body.cpV8.cpNativeV5 .cpCreatorUrlField>.field {
  height:47px!important;
  min-height:47px!important;
  font-size:14px!important;
  line-height:1.35!important;
}
body.cpV8.cpNativeV5 .cpCreatorUrlField>.field::placeholder {
  font-size:12.5px!important;
  opacity:1!important;
}
body.cpV8.cpNativeV5 .cpLaunchScreen .cpGetMediaButton {
  height:48px!important;
  min-height:48px!important;
  font-size:13.5px!important;
  border-radius:11px!important;
  background:linear-gradient(110deg,#6a74e5 0%,#8068e6 56%,#8f69ee 100%)!important;
  box-shadow:0 8px 18px rgba(80,68,177,.19),inset 0 1px 0 rgba(255,255,255,.18)!important;
}
body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported {
  min-height:23px!important;
  gap:5px!important;
}
body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported>span {
  font-size:8.5px!important;
  letter-spacing:.6px!important;
}
body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported>b {
  font-size:9px!important;
  padding:4px 6px!important;
  border-radius:6px!important;
}

/* Cleaner Power Editor + metrics rail; improve small captions. */
body.cpV8.cpNativeV5 .cpNativePostChoice,
body.cpV8.cpNativeV5 .cpNativeAccountMetrics {
  min-height:59px!important;
  height:59px!important;
  border-radius:12px!important;
}
body.cpV8.cpNativeV5 .cpNativeAccountMetrics>div {
  min-height:59px!important;
}
body.cpV8.cpNativeV5 .cpNativeChoiceText>b {
  font-size:12px!important;
}
body.cpV8.cpNativeV5 .cpNativeChoiceText>span {
  font-size:8.5px!important;
}
body.cpV8.cpNativeV5 .cpNativeAccountMetrics strong {
  font-size:17px!important;
}
body.cpV8.cpNativeV5 .cpNativeAccountMetrics small {
  font-size:8.5px!important;
  letter-spacing:0!important;
}
body.cpV8.cpNativeV5 .cpMemberMiniStrip {
  min-height:38px!important;
  padding:4px 6px!important;
}
body.cpV8.cpNativeV5 .cpMiniMembershipCopy>b {
  font-size:11px!important;
}
body.cpV8.cpNativeV5 .cpMiniMembershipCopy>span {
  font-size:9.5px!important;
  line-height:1.35!important;
}

/* Distinct bottom navigation that doesn't cover the composer or feel bulky. */
body.cpV8.cpNativeV5 .cpMiniBottomNav {
  min-height:61px!important;
  width:min(calc(100% - 28px),495px)!important;
  padding:5px!important;
  border-radius:19px!important;
  box-shadow:0 12px 34px rgba(5,8,27,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
  bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
}
body.cpV8.cpNativeV5[data-mini-theme="light"] .cpMiniBottomNav {
  box-shadow:0 11px 28px rgba(44,51,101,.12),inset 0 1px 0 #fff!important;
}
body.cpV8.cpNativeV5 .cpMiniNavBtn {
  min-height:49px!important;
  gap:2px!important;
  border-radius:13px!important;
  font-size:10.5px!important;
  line-height:1.25!important;
}
body.cpV8.cpNativeV5 .cpMiniNavBtn>.miniIcon {
  height:19px!important;width:19px!important;
  flex-basis:19px!important;
}
body.cpV8.cpNativeV5 .cpMiniNavBtn.is-active {
  background:linear-gradient(115deg,color-mix(in srgb,var(--nv-accent) 21%,var(--nv-panel)),color-mix(in srgb,var(--nv-accent) 8%,var(--nv-panel)))!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--nv-accent) 20%,transparent)!important;
}

/* Plan and Community remain separate, with crisp small information text. */
body.cpV8.cpNativeV5 .cpV8ScreenIntro {
  padding-top:13px!important;
}
body.cpV8.cpNativeV5 .cpV8ScreenIntro p {
  font-size:11.5px!important;
}
body.cpV8.cpNativeV5 .cpMemberFacts>span>b {
  font-size:11px!important;
}
body.cpV8.cpNativeV5 .cpMemberNote {
  font-size:10.5px!important;
}
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLink,
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLinks .cpFacebookLink {
  min-height:70px!important;
  box-shadow:0 4px 15px var(--nv-shadow)!important;
}
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLink b,
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLinks .cpFacebookLink b {
  font-size:12.5px!important;
}
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLink small,
body.cpV8.cpNativeV5[data-v8-home-tab="community"] .cpCommunityLinks .cpFacebookLink small {
  font-size:10px!important;
}

/* iOS: hide floating bottom navigation while URL keyboard is engaged.
   Body stage is unchanged and native keyboard scrolling keeps working. */
@supports selector(body:has(#sourceUrl:focus)) {
  body.cpV8.cpNativeV5[data-stage="source"]:has(#sourceUrl:focus) .cpMiniBottomNav {
    opacity:0!important;
    transform:translate(-50%,calc(110% + env(safe-area-inset-bottom,0px)))!important;
    pointer-events:none!important;
  }
}
body.cpV8.cpNativeV5 .cpMiniNavBtn,
body.cpV8.cpNativeV5 .cpGetMediaButton {
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
@media(max-width:390px) {
  body.cpV8.cpNativeV5 .cpNativeWelcome.cpV8Welcome {
    min-height:158px!important;
    padding:12px 13px 0!important;
  }
  body.cpV8.cpNativeV5 .cpV8Welcome .cpNativeWelcomeRow {
    min-height:89px!important;
  }
  body.cpV8.cpNativeV5 .cpV8HeroCopy h1 {
    font-size:27px!important;
  }
  body.cpV8.cpNativeV5 .cpV8HeroCopy p {
    font-size:10.8px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics small {
    font-size:8.3px!important;
  }
}
@media(max-width:360px) {
  body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported>span {
    display:none!important;
  }
  body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported {
    flex-wrap:wrap!important;
    overflow:visible!important;
    gap:5px!important;
  }
  body.cpV8.cpNativeV5 .cpCreatorSourceCard .cpSupported>b {
    font-size:8.4px!important;
    padding:4px 5px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeChoiceMark {
    width:31px!important;height:31px!important;flex-basis:31px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeChoiceText>b {
    font-size:11.2px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics>div {
    padding-inline:7px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics strong {
    font-size:16px!important;
  }
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics small {
    font-size:8px!important;
  }
  body.cpV8.cpNativeV5 .cpMiniBottomNav {
    width:calc(100% - 18px)!important;
    min-height:59px!important;
  }
}
@media(prefers-reduced-motion:reduce) {
  body.cpV8.cpNativeV5 .cpMiniBottomNav,
  body.cpV8.cpNativeV5 .cpMiniNavBtn,
  body.cpV8.cpNativeV5 .cpGetMediaButton {
    transition:none!important;
  }
}
/* Small-screen finish: prevent metric labels and subtitles from clipping. */
body.cpV8.cpNativeV5[data-mini-theme="light"] .cpMiniNavBtn:not(.is-active) {
  color:#64718d!important;
}
@media(max-width:360px) {
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics>div:first-child small {
    font-size:0!important;
    white-space:nowrap!important;
  }
  body.cpV8.cpNativeV5 .cpNativeAccountMetrics>div:first-child small::after {
    content:"Pages";
    font:620 9px/1.15 Manrope,Inter,sans-serif;
    color:var(--nv-dim);
  }
  body.cpV8.cpNativeV5 .cpNativeChoiceText>span {
    font-size:0!important;
    white-space:nowrap!important;
  }
  body.cpV8.cpNativeV5 .cpNativeChoiceText>span::after {
    content:"Quick Publish";
    font:520 8.5px/1.3 Manrope,Inter,sans-serif;
    color:var(--nv-dim);
  }
}