/*
 * JERKAN UI RESET — 2026-10-15
 * Owner-approved Typography A / editorial feed visual system.
 * Real JK component selectors, not a mockup or synthetic member feed.
 *
 * VISUAL ONLY: preserve existing JS/identity/consent/analytics/ranking/RTC,
 * disabled controls, aria state, content, dynamic data and route authority.
 * Checked against release/jk-beta/fe48841 before first production promotion.
 */

/* 00 / Brand tokens & universal rhythm */
:root {
  --jk-v3-paper: #ffffff;
  --jk-v3-canvas: #fbfaf9;
  --jk-v3-ink: #282427;
  --jk-v3-secondary: #665f65;
  --jk-v3-muted: #928b90;
  --jk-v3-line: #eee9eb;
  --jk-v3-soft: #f6f4f4;
  --jk-v3-rose: #e96374;
  --jk-v3-night: #1b161c;
  --jk-v3-night-surface: #211a22;
  --jk-v3-night-line: #382d38;
  --jk-v3-night-muted: #b9adb4;
  --jk-ui-font: "Noto Sans Thai","Inter","Segoe UI",Tahoma,system-ui,sans-serif;
  --font-ui: var(--jk-ui-font);
  --jk-ui-radius-card: 16px;
  --jk-ui-radius-control: 12px;
}
body.g2-adult-beta,
body.g2-adult-beta #phone,
body.g2-adult-beta #phone .app {
  font-family: var(--jk-ui-font);
}
#phone {
  --font-ui: var(--jk-ui-font);
  --type-title: 23px;
  --type-body: 14px;
  --jk-ui-ink: var(--jk-v3-ink);
  --jk-ui-muted: var(--jk-v3-muted);
  --jk-ui-line: var(--jk-v3-line);
}
#phone .app { background: var(--jk-v3-paper); }
#phone .screen:not([data-screen="stories"]),
#phone .screen[data-screen="activities"] {
  background: var(--jk-v3-paper);
  color: var(--jk-v3-ink);
}
#phone :is(.screen,.reader,.entry-flow,.chat-thread,.ux-sheet) {
  letter-spacing: normal;
  overflow-wrap: break-word;
}
#phone :is(.screen,.reader,.entry-flow,.chat-thread,.ux-sheet)
  :is(p,small,label,li,span,time) { letter-spacing: normal; }
#phone :is(.screen,.reader,.entry-flow,.chat-thread)
  :is(p,li) { line-height: 1.72; }
#phone .screen :is(h1,h2,h3,h4),#phone .entry-step h2 {
  letter-spacing: -.013em;
  text-wrap: pretty;
  line-height: 1.44;
  font-weight: 600;
}
#phone .screen :is(.sub,.meta,.ux-note,.jk-ia-kicker) {
  font-weight: 400;
  line-height: 1.58;
  letter-spacing: normal;
}
#phone :is(.btn,.jk-primary,.jk-secondary,.jk-quiet,.iconbtn,.entry-primary,.entry-quiet) {
  -webkit-tap-highlight-color: transparent;
}
#phone :is(button,a):focus-visible,
#jk-thread-live-dialog :is(button,input,textarea):focus-visible,
#jk-thread-dialog :is(button,input,textarea):focus-visible,
#jk-story-dialog :is(button,input,textarea):focus-visible {
  outline: 2px solid var(--jk-v3-rose);
  outline-offset: 2px;
}
#phone :is(button,a):is([disabled],[aria-disabled="true"]) {
  cursor: not-allowed;
}
/* Do not override the global [hidden] contract or reveal gated features. */

/* 01 / Unified header, original real logo and nav */
#phone .screen:is([data-screen="meet"],[data-screen="chat"],[data-screen="me"],[data-screen="stories"])
  >.jk-main-topbar {
  min-height: 64px;
  padding: 9px 0 12px;
  margin: 0 0 13px;
  gap: 10px;
  border-bottom: 1px solid var(--jk-v3-line);
}
#phone .jk-main-topbar .jk-screen-title {
  align-items: center;
  gap: 11px;
  min-width: 0;
}
#phone .jk-main-topbar .jk-brand-mark {
  width: 33px;
  height: 33px;
  flex: 0 0 33px;
  border-radius: 9px;
  object-fit: cover;
}
#phone .screen .jk-main-topbar .h1,
#phone.story-context .screen .jk-main-topbar .h1 {
  font-size: clamp(22px,6vw,26px);
  font-weight: 600 !important;
  line-height: 1.33;
  letter-spacing: -.023em;
  margin: 0;
}
#phone .jk-main-topbar > .iconbtn,
#phone .jk-main-topbar > button.jk-header-action {
  min-width: 43px;
  min-height: 43px;
  flex: 0 0 auto;
  border-radius: 12px;
  box-shadow: none;
  font-size: 13px;
  font-weight: 500 !important;
}
#phone .jk-main-topbar > .iconbtn:not(#new-story-btn) {
  background: transparent;
  border: 0;
}
#phone .jk-main-topbar .jk-header-action,
#phone .btn.secondary {
  background: #fff;
  color: var(--jk-v3-ink);
  border: 1px solid var(--jk-v3-line);
  box-shadow: none;
}
#phone .jk-main-topbar svg.jk-icon,
#phone .info-item svg.jk-icon,
#phone .reentry-go svg.jk-icon {
  display: block;
  flex: 0 0 auto;
  vertical-align: middle;
}
body.g2-adult-beta #phone #bottom-nav {
  --jk-v3-nav-bg:#fff;
  grid-template-columns: repeat(var(--jk-nav-columns,4),minmax(0,1fr)) !important;
  min-height: 68px;
  padding: 4px 3px calc(5px + env(safe-area-inset-bottom,0px));
  border-top: 1px solid var(--jk-v3-line);
  background: var(--jk-v3-nav-bg);
  box-shadow: 0 -4px 20px rgba(35,25,30,.025);
  align-items: stretch;
}
#phone #bottom-nav .navbtn,
#phone #bottom-nav .navbtn.signature {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 4px;
  min-width: 0;
  min-height: 56px;
  padding: 5px 2px;
  border:0;
  background:transparent;
  box-shadow:none;
  color:#a49ca2;
  font-size: 10.5px;
  font-weight: 400 !important;
  line-height: 1.3;
  position: relative;
}
#phone #bottom-nav .navbtn .ni {
  width: 23px;
  height: 23px;
  min-width: 23px;
  display:flex;
  justify-content:center;
  align-items:center;
}
#phone #bottom-nav .navbtn .ni svg.jk-icon {
  display:block;
  height:21px;
  width:21px;
  flex:0 0 21px;
  margin:0;
  transform:none;
}
#phone #bottom-nav .navbtn > span:last-child {
  display:block;
  font:inherit;
  font-weight:inherit !important;
  overflow:hidden;
  max-width:100%;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.4;
}
#phone #bottom-nav .navbtn:is(.active,[aria-current="page"]) {
  color:var(--jk-v3-rose) !important;
  background:transparent !important;
}
#phone #bottom-nav .navbtn:is(.active,[aria-current="page"])::after {
  content:"";
  width:19px;
  height:2px;
  position:absolute;
  top:0;
  left:calc(50% - 9.5px);
  border-radius:100px;
  background:var(--jk-v3-rose);
}
#phone #bottom-nav .navbtn:before {
  border:0;
  box-shadow:none;
}

/* 02 / Shared inputs, sheets, CTA and status areas */
#phone .screen :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select) {
  border-radius: 12px;
  border: 1px solid var(--jk-v3-line);
  background: var(--jk-v3-canvas);
  box-shadow: none;
  font: 400 14px/1.6 var(--jk-ui-font);
  min-height: 44px;
  letter-spacing: normal;
}
#phone .screen :is(input,textarea)::placeholder { color: #999197; opacity:1; }
#phone .screen :is(.btn,.jk-primary,.jk-secondary,.jk-quiet,.toggle) {
  min-height:44px;
  font-weight:500 !important;
  border-radius:12px;
  font-size:13px;
  line-height:1.45;
  letter-spacing:normal;
  box-shadow:none;
}
#phone .screen :is(.btn,.jk-primary).primary,
#phone .screen .btn:not(.secondary):not([disabled]) {
  background: var(--jk-v3-rose);
  color: #fff;
  border-color: var(--jk-v3-rose);
}
#phone .screen .empty-state {
  background: var(--jk-v3-canvas);
  border: 1px solid var(--jk-v3-line);
  border-radius: 16px;
  box-shadow: none;
  padding: 23px 17px;
  color: var(--jk-v3-secondary);
  line-height: 1.7;
}
#phone .screen .empty-state :is(b,strong,h3) { color:var(--jk-v3-ink);font-weight:600; }
#phone .screen :is(.mpr-surface-state,.g2-recovery-nudge,.reentry-card,.ux-note) {
  border-radius:14px;
  box-shadow:none;
}
#phone .screen .section-head { gap: 9px; align-items: center; }
#phone .screen .section-head h3 {
  font-size: 16px;
  font-weight: 600 !important;
  line-height:1.5;
}
#phone .screen .section-head .sub { font-size:11px; color:var(--jk-v3-muted); }
#phone .screen :is(.jk-ia-kicker,.jk-ia-screen-tag,.live-line) {
  font-weight:500 !important;
  letter-spacing: .01em;
}
#phone .ux-sheet,
#phone :is(.meet-area-sheet,.profile-media-sheet,.hello-sheet,.person-sheet) {
  border-radius: 22px 22px 0 0;
  background:#fff;
  box-shadow:0 -10px 30px rgba(29,22,28,.1);
}

/* 03 / Meet: redesign actual member supply as a quiet vertical feed.
   Existing real cards, buttons, location privacy and ranking are untouched. */
#phone [data-screen="meet"] >.sub {
  font-size:13px;
  line-height:1.65;
  color:var(--jk-v3-muted);
  margin:0 0 15px;
}
#phone [data-screen="meet"] #meet-community {
  border:0;
  border-radius:16px;
  background:var(--jk-v3-canvas);
  box-shadow:none;
  padding:16px;
  margin:0 0 19px;
}
#phone [data-screen="meet"] .jk-ia-meet-intro,
#phone [data-screen="meet"] .meet-community-bottom {
  border-radius:15px;
  background:var(--jk-v3-canvas);
  box-shadow:none;
  border:1px solid var(--jk-v3-line);
  color:var(--jk-v3-ink);
  padding:17px;
  margin:0 0 19px;
}
#phone [data-screen="meet"] .jk-ia-meet-intro h2 {
  font-size:21px;
  font-weight:600;
  line-height:1.5;
  color:var(--jk-v3-ink);
  margin:4px 0;
}
#phone [data-screen="meet"] .jk-ia-meet-intro :is(p,.jk-ia-kicker) {
  color:var(--jk-v3-muted);
  font-size:12px;
  font-weight:400 !important;
  line-height:1.65;
}
#phone [data-screen="meet"] .meet-community-bottom p { color:var(--jk-v3-secondary); }
#phone [data-screen="meet"] .meet-community-bottom button.route { color:var(--jk-v3-rose); font-weight:500; }
#phone [data-screen="meet"] :is(.meet-discovery-controls,.meet-mode-picker) {
  gap:6px;
  border-radius:14px;
}
#phone [data-screen="meet"] .meet-mode-picker {
  border:1px solid var(--jk-v3-line);
  background:var(--jk-v3-soft);
  padding:4px;
}
#phone [data-screen="meet"] .meet-mode-picker button,
#phone [data-screen="meet"] .meet-area-picker {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:9px 12px;
  border-radius:11px;
  font:500 13px/1.45 var(--jk-ui-font);
}
#phone [data-screen="meet"] .meet-mode-picker button[aria-pressed="true"] {
  background:#fff;
  color:var(--jk-v3-ink);
  box-shadow:0 1px 3px rgba(30,20,25,.055);
}
#phone [data-screen="meet"] .meet-area-picker {
  border:1px solid var(--jk-v3-line);
  background:#fff;
  gap:6px;
}
#phone [data-screen="meet"] .meet-area-picker > span {line-height:1.45;align-self:center;}
#phone [data-screen="meet"] .jk-ia-people-heading {margin:24px 0 12px;}
#phone [data-screen="meet"] .jk-ia-people-heading h3 {font-size:17px;line-height:1.5;}
#phone [data-screen="meet"] .jk-ia-people-heading .jk-ia-kicker {
  color:var(--jk-v3-muted);
  font-size:10px;
  letter-spacing:.07em;
}
#phone [data-screen="meet"] #meet-discovery-row {
  display:flex;
  flex-direction:column;
  overflow-x:visible;
  overflow-y:visible;
  scroll-snap-type:none;
  align-items:stretch;
  gap:0;
  margin:0;
  padding:0;
  width:100%;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person {
  width:100% !important;
  max-width:100% !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  padding:0 0 19px !important;
  margin:0 0 21px !important;
  border:0 !important;
  border-bottom:1px solid var(--jk-v3-line) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#fff !important;
  gap:8px;
  text-align:left;
  scroll-snap-align:none;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person .portrait {
  width:100%;
  aspect-ratio: 1.34/1;
  max-height: 300px;
  min-height:170px;
  margin:0 0 3px;
  padding:0;
  overflow:hidden;
  background:#ded8d9;
  border-radius:14px;
  border:0;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person .portrait img,
#phone [data-screen="meet"] #meet-discovery-row .mpr-person-photo {
  height:100%;
  width:100%;
  object-fit:cover;
  object-position:center 36%;
  border-radius:0;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person .name {
  font-size:17px;
  font-weight:600 !important;
  letter-spacing:normal;
  line-height:1.48;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person :is(.meta,.mpr-area,.badge,.mpr-intent) {
  font-size:12px !important;
  font-weight:400 !important;
  color:var(--jk-v3-muted);
  line-height:1.6;
  letter-spacing:normal;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person .person-reason {
  color:var(--jk-v3-secondary);
  font-size:13px !important;
  font-weight:400 !important;
  line-height:1.8;
  letter-spacing:normal;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person :is(.mpr-trust,.mpr-cta-note) {
  color:var(--jk-v3-muted);
  font-size:12px;
  font-weight:400;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person :is(.btn,.connect) {
  min-height:43px;
  border-radius:12px;
  font-size:13px;
  font-weight:500 !important;
}
#phone [data-screen="meet"] #meet-discovery-row .mpr-person :is(.mpr-profile,.actions) {
  margin-top:5px;
}
#phone [data-screen="meet"] .meet-tools {
  border:1px solid var(--jk-v3-line);
  border-radius:14px;
  background:var(--jk-v3-canvas);
  margin:16px 0;
  padding:0 14px;
}
#phone [data-screen="meet"] .meet-tools summary {
  min-height:52px;
  display:flex;
  align-items:center;
  font-size:13px;
  font-weight:500;
  color:var(--jk-v3-secondary);
}
#phone [data-screen="meet"] .jk-ia-filter-mode {
  border:none;
  background:transparent;
  padding:12px 0 17px;
  border-radius:0;
}

/* 04 / Random, without advertising any server-locked capability as active. */
#phone [data-screen="random"] .random-intro {
  border:1px solid var(--jk-v3-line);
  border-radius:16px;
  background:var(--jk-v3-canvas);
  padding:21px 17px;
  color:var(--jk-v3-ink);
  box-shadow:none;
}
#phone [data-screen="random"] .random-intro h2 {
  font-size:20px;
  line-height:1.55;
  font-weight:600;
  color:var(--jk-v3-ink);
}
#phone [data-screen="random"] .random-intro p,
#phone [data-screen="random"] .jk-ia-kicker {
  color:var(--jk-v3-muted);
  font-weight:400;
  font-size:12px;
}
#phone [data-screen="random"] :is(.random-chat-option,.random-panel .mode) {
  background:#fff;
  border:1px solid var(--jk-v3-line);
  border-radius:16px;
  box-shadow:none;
  padding:18px;
}
#phone [data-screen="random"] :is(.random-chat-option,.random-panel .mode) h3 {
  font-size:17px;
  font-weight:600;
  line-height:1.55;
}
#phone [data-screen="random"] .jk-ia-random-card-icon,
#phone [data-screen="random"] .jk-ia-voice-icon {
  background:var(--jk-v3-soft);
  color:var(--jk-v3-ink);
  border-radius:13px;
}

/* 05 / Deep Talk: true night editorial feed from owner HTML, not old pill/grid cards. */
#phone.story-context,
#phone.story-context .app,
#phone.story-context .story-hub {
  --jk-ui-story-backdrop: var(--jk-v3-night);
  --jk-ui-story-canvas: var(--jk-v3-night);
  --jk-ui-story-card: var(--jk-v3-night);
  --jk-ui-night-canvas: var(--jk-v3-night);
  --jk-ui-night-surface: var(--jk-v3-night-surface);
  --jk-ui-night-line: var(--jk-v3-night-line);
  --jk-ui-night-text: #f8f2f5;
  --jk-ui-night-muted: var(--jk-v3-night-muted);
  --jk-ui-night-wine: #3f2936;
  --jk-ui-story-nav: var(--jk-v3-night-surface);
  --jk-ui-story-nav-border: var(--jk-v3-night-line);
  --jk-ui-story-nav-pill: #3f2936;
  --jk-ui-coral-text-night: #f1a2b0;
  background:var(--jk-v3-night) !important;
  color:#f8f2f5;
  color-scheme:dark;
}
#phone.story-context .screen[data-screen="stories"] {
  padding: 8px 18px 26px;
}
#phone.story-context .story-hub > .deep-topbar {
  padding:7px 0 17px;
  border-bottom:1px solid var(--jk-v3-night-line);
  margin:0 0 18px;
  min-height:62px;
  display:flex;
  align-items:center;
}
#phone.story-context .story-hub .jk-brand-mark { width:31px;height:31px;flex-basis:31px;border-radius:8px; }
#phone.story-context .story-hub .h1 {
  font-weight:600 !important;
  font-size:23px !important;
  line-height:1.35;
  letter-spacing:-.025em;
  color:#f8f3f5;
}
#phone.story-context #new-story-btn {
  background:var(--jk-v3-rose);
  color:#fff;
  border:0;
  box-shadow:none;
  border-radius:12px;
  min-height:43px;
  font-weight:500 !important;
  font-size:13px;
  padding:9px 12px;
}
#phone.story-context #new-story-btn .jk-icon { width:17px;height:17px; }
#phone.story-context .deep-core-tabs {
  margin: 0 0 17px;
  padding:3px;
  border:1px solid var(--jk-v3-night-line);
  border-radius:13px;
  background:var(--jk-v3-night-surface);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3px;
  box-shadow:none;
}
#phone.story-context .deep-core-tabs button {
  background:transparent;
  color:var(--jk-v3-night-muted);
  min-height:54px;
  border:1px solid transparent;
  border-radius:10px;
  padding:8px 4px;
  font-size:13px;
  font-weight:400;
  text-align:center;
}
#phone.story-context .deep-core-tabs b {
  font-weight:500 !important;
  font-size:14px;
  color:#ede3e9;
  line-height:1.45;
}
#phone.story-context .deep-core-tabs small {
  font-size:11px;
  line-height:1.5;
  color:var(--jk-v3-night-muted);
}
#phone.story-context .deep-core-tabs button[aria-pressed="true"] {
  background:#382734;
  border-color:#5e4054;
  box-shadow:none;
}
#phone.story-context .thread-chip-row {
  gap:5px;
  padding:2px 0 12px;
  margin-bottom:10px;
  border-bottom:1px solid var(--jk-v3-night-line);
}
#phone.story-context .thread-chip {
  border:0;
  background:transparent;
  color:var(--jk-v3-night-muted);
  border-radius:10px;
  padding:10px 12px;
  min-height:40px;
  font-size:12px;
  font-weight:400 !important;
  white-space:nowrap;
}
#phone.story-context .thread-chip[aria-pressed="true"] {
  background:#3b2936;
  color:#f9eaf0;
  border:0;
  font-weight:500 !important;
}
#phone.story-context .thread-search {
  min-height:46px;
  border:1px solid var(--jk-v3-night-line);
  border-radius:13px;
  background:#241e25;
  padding:11px 14px;
  font:400 13px/1.6 var(--jk-ui-font);
  color:#f8f2f5;
  margin:5px 0 20px;
}
#phone.story-context .thread-search::placeholder {color:#a99da5;}
#phone.story-context .thread-section-heading {
  font-size:13px;
  font-weight:500;
  color:#cfbec7;
  margin:12px 0 13px;
}
#phone.story-context :is(.thread-note,.thread-type,.thread-byline,.thread-status) {
  font-size:11px;
  font-weight:400 !important;
  color:#bbaab5;
  line-height:1.65;
}
#phone.story-context .thread-list {
  display:flex;
  flex-direction:column;
  gap:0;
  width:100%;
}
#phone.story-context .thread-card,
#phone.story-context .jk-live-card {
  display:block;
  width:100%;
  min-width:0;
  border:0;
  border-bottom:1px solid var(--jk-v3-night-line);
  border-radius:0;
  padding:17px 0 20px;
  margin:0;
  background:transparent;
  box-shadow:none;
  content-visibility:auto;
  contain-intrinsic-size:auto 230px;
}
#phone.story-context .thread-card:first-child,
#phone.story-context .jk-live-card:first-child { padding-top:6px; }
#phone.story-context .thread-card h3 {
  font-size:16px;
  font-weight:500 !important;
  line-height:1.65;
  margin:9px 0 4px;
  color:#f7f1f5;
  letter-spacing:normal;
}
#phone.story-context .thread-card p {
  font-size:12px;
  line-height:1.84;
  margin:6px 0 8px;
  color:var(--jk-v3-night-muted);
}
#phone.story-context .thread-byline {
  margin:3px 0 0;
  align-items:center;
  gap:8px;
  font-size:11px;
}
#phone.story-context :is(.thread-avatar,.jk-live-avatar) {
  width:29px;
  height:29px;
  border-radius:50%;
  background:#422b39;
  color:#eed0da;
  font-size:12px;
  font-weight:500;
  box-shadow:none;
}
#phone.story-context :is(.thread-actions,.jk-live-actions,.jk-live-reactions) {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  align-items:center;
  gap:5px;
  margin:10px 0 0;
  border:0;
}
#phone.story-context :is(.thread-button,.jk-live-actions button,.jk-live-reactions button) {
  border:0;
  background:transparent;
  border-radius:10px;
  min-height:43px;
  min-width:43px;
  padding:8px 9px;
  font:400 12px/1.5 var(--jk-ui-font);
  color:#cbbec6;
  box-shadow:none;
}
#phone.story-context :is(.thread-button,.jk-live-actions button,.jk-live-reactions button)[aria-pressed="true"] {
  background:#352631;
  color:#f1c4d0;
}
#phone.story-context .thread-button.primary,
#phone.story-context .jk-live-button.primary {
  background:var(--jk-v3-rose);
  color:#fff;
  border:0;
}
#phone.story-context .jk-live-post-body {
  font:500 15px/1.75 var(--jk-ui-font);
  color:#f8f2f5;
  padding:14px 0 2px;
  letter-spacing:normal;
}
#phone.story-context .jk-live-byline {font-size:13px;gap:8px;}
#phone.story-context .jk-live-byline small {font-size:11px;line-height:1.5;color:#ac9ca6;}
#phone.story-context .jk-live-pages {margin:20px 0;gap:12px;font-size:12px;color:#b9a9b4;}
#phone.story-context .jk-live-empty,
#phone.story-context .thread-empty {
  background:#211b22;
  border:1px dashed #443640;
  border-radius:14px;
  padding:20px 16px;
  color:#c8b9c2;
}
#phone.story-context .thread-mode-note,
#phone.story-context .thread-replies {line-height:1.7;}

/* Real Story hub / reader / writer */
#phone.story-context #jk-story-workspace .story-tabs {
  gap: 4px;
  border-bottom:1px solid var(--jk-v3-night-line);
  background:transparent;
  margin-bottom:16px;
}
#phone.story-context #jk-story-workspace .story-tabs button {
  min-height:44px;
  font:400 13px/1.5 var(--jk-ui-font);
  color:#b3a4ae;
}
#phone.story-context #jk-story-workspace .story-tabs button[aria-current="page"] {
  font-weight:500;
  color:#ed9ead;
  box-shadow:inset 0 -2px #e96374;
}
#phone.story-context #jk-story-workspace .story-list { gap:0; }
#phone.story-context #jk-story-workspace .story-row {
  display:grid;
  grid-template-columns:106px minmax(0,1fr);
  align-items:center;
  gap:13px;
  border:0;
  border-bottom:1px solid var(--jk-v3-night-line);
  border-radius:0;
  background:transparent;
  padding:14px 0;
  margin:0;
  min-height:120px;
}
#phone.story-context #jk-story-workspace .story-row h3 {
  font-size:15px;
  font-weight:500;
  line-height:1.6;
  color:#f8f2f5;
}
#phone.story-context #jk-story-workspace .story-row p {
  font-size:12px;
  line-height:1.7;
  color:#ae9fa9;
}
#phone.story-context #jk-story-workspace :is(.cover,.cover-art,.story-cover,.story-row-cover) {
  border-radius:11px;
  overflow:hidden;
}
#phone.story-context #jk-story-workspace :is(.story-meta,.story-mode-note) {
  font-size:11px;
  font-weight:400;
  color:#a899a5;
}
#phone.story-context #jk-story-workspace :is(.paper,.story-card,.sample-card,.shelf-card,.feature) {
  border-color:var(--jk-v3-night-line);
  border-radius:14px;
  box-shadow:none;
}
#phone.story-context #jk-story-workspace :is(.feed-sort,.feed-controls,.library-tools) {
  gap:8px;
}
#phone.story-context #jk-story-workspace :is(.field,.writing-body,.search) {
  font:400 14px/1.75 var(--jk-ui-font);
}
#phone.story-context #story-reader {
  background:var(--jk-v3-night);
  color:#f8f2f5;
}
#phone.story-context #story-reader .reader-head {
  background:var(--jk-v3-night-surface);
  border-bottom:1px solid var(--jk-v3-night-line);
}
#phone.story-context #story-reader .reader-cover {
  background:#272029;
  border:1px solid var(--jk-v3-night-line);
  border-radius:14px;
}
#phone.story-context #story-reader .reader-copy {
  font:400 17px/1.95 var(--jk-ui-font);
  letter-spacing:normal;
  color:#e9dfe5;
}
#jk-story-dialog,
#jk-thread-dialog,
#jk-thread-live-dialog {
  font-family:var(--jk-ui-font);
  border-radius:20px;
  box-shadow:0 22px 50px #0005;
}
#jk-thread-live-dialog :is(.jk-live-button,.jk-live-field),
#jk-thread-dialog :is(.thread-button,.thread-field) {
  border-radius:12px;
  font-family:var(--jk-ui-font);
  font-weight:500;
  letter-spacing:normal;
}
#jk-thread-live-dialog .jk-live-button.primary {background:#e96374;color:#fff;}
#jk-thread-live-dialog .jk-live-field,
#jk-thread-dialog .thread-field {font-size:15px;line-height:1.8;}
#phone.story-context #bottom-nav {
  --jk-v3-nav-bg:var(--jk-v3-night-surface);
  background:var(--jk-v3-night-surface) !important;
  border-top:1px solid var(--jk-v3-night-line);
  box-shadow:none;
}
#phone.story-context #bottom-nav .navbtn {color:#a99ba7 !important;}
#phone.story-context #bottom-nav .navbtn:is(.active,[aria-current="page"]) {
  color:#f2b2c1 !important;
  background:transparent !important;
}

/* 06 / Chat: quiet conversation list, consent/empty/error states remain authoritative */
#phone [data-screen="chat"] .reentry-card {
  background:var(--jk-v3-canvas);
  border:1px solid var(--jk-v3-line);
  padding:14px;
  margin:0 0 15px;
}
#phone [data-screen="chat"] .reentry-copy :is(span,small) {
  font-size:12px;
  color:var(--jk-v3-muted);
  line-height:1.6;
}
#phone [data-screen="chat"] .reentry-copy b {font-weight:500;color:var(--jk-v3-ink);}
#phone [data-screen="chat"] .mpr-surface-state {
  margin:14px 0;
  padding:16px;
  background:var(--jk-v3-canvas);
  border:1px solid var(--jk-v3-line);
  color:var(--jk-v3-secondary);
}
#phone [data-screen="chat"] .mpr-surface-state b {
  font-weight:500;
  color:var(--jk-v3-ink);
}
#phone [data-screen="chat"] :is(.chatrow,.chat-row,.chat-item,.conversation-row) {
  background:#fff;
  border:0;
  border-bottom:1px solid var(--jk-v3-line);
  box-shadow:none;
  padding:13px 2px;
  border-radius:0;
}
#phone [data-screen="chat"] :is(.chatrow,.chat-row,.chat-item,.conversation-row) :is(b,strong) {
  font-size:14px;
  font-weight:500;
}
#phone [data-screen="chat"] :is(.chatrow,.chat-row,.chat-item,.conversation-row) :is(small,p) {
  font-size:12px;
  color:var(--jk-v3-muted);
  font-weight:400;
  line-height:1.5;
}
#phone .chat-thread :is(.message,.bubble) {
  border-radius:15px;
  box-shadow:none;
  line-height:1.7;
}

/* 07 / Me: editorial identity panel and simple settings rows */
#phone [data-screen="me"] > .sub {
  font-size:13px;
  color:var(--jk-v3-muted);
  margin:0 0 19px;
}
#phone [data-screen="me"] .jk-self-profile {
  background:#fff !important;
  border:0 !important;
  border-bottom:1px solid var(--jk-v3-line) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:10px 0 19px !important;
  margin:0 0 20px !important;
}
#phone [data-screen="me"] .jk-self-profile .jk-profile-hero {
  display:flex;
  align-items:center;
  gap:14px;
  padding:0;
  border:0;
}
#phone [data-screen="me"] .jk-self-profile #my-profile-avatar {
  width:74px;
  height:74px;
  flex:0 0 74px;
  border-radius:17px;
  font-size:23px;
  overflow:hidden;
}
#phone [data-screen="me"] #my-profile-title {
  font-size:19px;
  font-weight:600 !important;
  line-height:1.5;
  color:var(--jk-v3-ink);
}
#phone [data-screen="me"] #my-profile-meta,
#phone [data-screen="me"] .jk-profile-intro {
  color:var(--jk-v3-muted);
  font-size:12px;
  font-weight:400;
  line-height:1.7;
}
#phone [data-screen="me"] .jk-self-profile .section-head {margin:18px 0 9px !important;}
#phone [data-screen="me"] .jk-self-profile .section-head h3 {
  font-size:14px;
  font-weight:500 !important;
}
#phone [data-screen="me"] .switches {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
}
#phone [data-screen="me"] .switches .toggle {
  min-height:42px;
  border-radius:999px;
  background:var(--jk-v3-soft);
  border:1px solid var(--jk-v3-line);
  color:var(--jk-v3-secondary);
  font-size:12px;
  font-weight:400;
  padding:7px 11px;
}
#phone [data-screen="me"] .jk-profile-album {margin:14px 0 22px;}
#phone [data-screen="me"] .jk-album-grid {gap:5px;}
#phone [data-screen="me"] .jk-album-tile {
  background:var(--jk-v3-soft);
  border:1px solid var(--jk-v3-line);
  border-radius:9px;
  box-shadow:none;
}
#phone [data-screen="me"] .jk-status-detail {
  border:0;
  border-bottom:1px solid var(--jk-v3-line);
  border-radius:0;
  background:#fff;
  padding:0;
  margin:0;
  box-shadow:none;
}
#phone [data-screen="me"] .jk-status-detail >summary {
  display:flex;
  align-items:center;
  padding:15px 2px;
  font-size:13px;
  font-weight:500;
  line-height:1.5;
  background:transparent;
  color:var(--jk-v3-secondary);
}
#phone [data-screen="me"] .info-list {
  background:#fff;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
  margin:18px 0;
}
#phone [data-screen="me"] .info-item {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:54px;
  padding:14px 2px;
  margin:0;
  border:0;
  border-bottom:1px solid var(--jk-v3-line);
  border-radius:0;
  background:#fff;
  color:var(--jk-v3-secondary);
  box-shadow:none;
  font:400 13px/1.5 var(--jk-ui-font);
}
#phone [data-screen="me"] .info-item svg.jk-icon {
  width:17px;height:17px;
  color:#9a9096;
  margin-left:auto;
}
#phone [data-screen="me"] .info-item small {display:block;font-size:11px;color:var(--jk-v3-muted);}
#phone [data-screen="me"] .g2-readiness-card {
  border:1px solid var(--jk-v3-line);
  border-radius:14px;
  background:var(--jk-v3-canvas);
  box-shadow:none;
  padding:13px;
}

/* 08 / Entry, account, profile editor, sheets — same UI family */
#phone #entry-flow {
  font-family:var(--jk-ui-font);
  background:#fff;
  color:var(--jk-v3-ink);
}
#phone #entry-flow .entry-panel {max-width:470px;}
#phone #entry-flow .entry-brand .jk-brand-mark {
  width:49px;height:49px;
  flex:0 0 49px;
  border-radius:13px;
}
#phone #entry-flow .jk-brand-name {
  font-size:23px;
  font-weight:600 !important;
  letter-spacing:-.018em;
}
#phone #entry-flow .entry-step h2,
#phone #entry-flow #entry-account-title {
  font-size:23px;
  font-weight:600 !important;
  letter-spacing:-.01em;
  line-height:1.5;
}
#phone #entry-flow .entry-step p {
  font-size:13px;
  line-height:1.75;
  font-weight:400;
  color:var(--jk-v3-muted);
}
#phone #entry-flow .entry-kicker {font-weight:500;letter-spacing:.02em;}
#phone #entry-flow :is(.entry-primary,.entry-quiet,.entry-social-button) {
  min-height:48px;
  border-radius:13px;
  font:500 14px/1.5 var(--jk-ui-font);
  box-shadow:none;
  letter-spacing:normal;
}
#phone #entry-flow .entry-primary {background:var(--jk-v3-rose);color:#fff;}
#phone #entry-flow .entry-social-button {
  background:#fff;
  border:1px solid var(--jk-v3-line);
  color:var(--jk-v3-ink);
}
#phone #entry-flow :is(.entry-input,input:not([type="checkbox"]):not([type="radio"])) {
  min-height:48px;
  border-radius:12px;
  border:1px solid var(--jk-v3-line);
  background:#fbfafb;
  font:400 15px/1.6 var(--jk-ui-font);
}
#phone :is(.jk-profile-edit,.entry-panel,.profile-media-sheet) :is(label,small,.entry-note) {
  line-height:1.6;
  letter-spacing:normal;
}
#phone :is(.reader,.entry-flow,.chat-thread) svg.jk-icon {vertical-align:middle;}
/* Unified chevron + text baseline at intrinsic 24px vector box. */
#phone :is(.meet-area-picker,.info-item,.reentry-go,.home-launch-card,
  .deep-feature-cta,.jk-header-action) > svg.jk-icon {
  width:18px;
  height:18px;
  display:block;
  flex:0 0 18px;
  align-self:center;
  transform:none;
}
#phone :is(.meet-area-picker,.info-item,.home-launch-card,
  .deep-feature-cta,.jk-header-action) {
  align-items:center;
  gap:8px;
}
#phone svg.jk-icon:has(use[href="#i-chevron-right"]),
#phone svg.jk-icon:has(use[href="#i-chevron-left"]) {
  vertical-align:middle;
  transform:translateY(0);
}
#phone .screen :is(.thread-card,.mpr-person,.info-item,.story-row) {
  -webkit-tap-highlight-color:transparent;
}
@media(max-width:359px) {
  #phone .screen {padding-left:15px;padding-right:15px;}
  #phone.story-context .screen[data-screen="stories"] {padding-left:15px;padding-right:15px;}
  #phone .screen .jk-main-topbar .h1 {font-size:21px;}
  #phone #bottom-nav .navbtn {font-size:10px;}
  #phone.story-context #jk-story-workspace .story-row {grid-template-columns:86px minmax(0,1fr);gap:10px;}
  #phone [data-screen="meet"] #meet-discovery-row .mpr-person .portrait {min-height:150px;}
}
@media(prefers-reduced-motion:reduce) {
  #phone :is(.screen,.reader,.entry-flow,.chat-thread) {
    scroll-behavior:auto;
  }
}

/* P1 / Night canvas compatibility with historic high-specificity Deep Talk paint.
   Explicit scope is needed: its old dark backdrop token can beat generic shared paint. */
body.g2-adult-beta #phone.story-context > .app,
body.g2-adult-beta #phone.story-context > main.app,
body.g2-adult-beta #phone.story-context main.app > section.screen.story-hub[data-screen="stories"] {
  --jk-ui-story-canvas:#1b161c !important;
  --jk-ui-story-backdrop:#1b161c !important;
  background:#1b161c !important;
  background-color:#1b161c !important;
  color:#f8f2f5;
}
