/* Messages + body note, 2026-10-17.
   The home page supplies the atmosphere; these pages use editorial structure
   rather than copying its stacked cards. */

.app[data-route="chat"]:not(.chat-detail) .app-header{
  min-height:calc(var(--safe-top) + 108px);
  padding-bottom:12px;
}
.app[data-route="chat"]:not(.chat-detail) .eyebrow{
  font-size:.72rem;
  letter-spacing:.115em;
  text-transform:lowercase;
}
.app[data-route="chat"]:not(.chat-detail) .app-header h1{
  margin-top:7px;
  font:600 clamp(1.5rem,6vw,2.08rem)/1.05 "PingFang SC","Songti SC",serif;
  letter-spacing:.015em;
  white-space:nowrap;
}
.app[data-route="chat"]:not(.chat-detail) .icon-btn{
  width:36px;
  height:36px;
  border-color:color-mix(in srgb,var(--accent) 15%,var(--glass-edge));
  background:color-mix(in srgb,var(--panel-strong) 72%,transparent);
  box-shadow:inset 0 1px 0 var(--glass-highlight),0 6px 18px rgba(var(--shadow-rgb),.035);
}

.contacts-page{
  padding-top:calc(var(--safe-top) + 117px);
  padding-left:20px;
  padding-right:20px;
}
.contacts-journal-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:12px;
  margin:2px 2px 17px;
  padding-bottom:13px;
  border-bottom:1px solid color-mix(in srgb,var(--line) 80%,transparent);
}
.contacts-journal-head span{
  color:var(--accent-deep,var(--accent));
  font:600 .54rem/1.1 "Avenir Next","Helvetica Neue",sans-serif;
  letter-spacing:.17em;
  white-space:nowrap;
}
.contacts-journal-head p{
  margin:0;
  color:var(--muted);
  font:italic .72rem/1.45 Georgia,"Songti SC",serif;
  text-align:right;
}
.contact-list{gap:15px}
.correspondence-entry.contact-row{
  position:relative;
  min-height:112px;
  padding:19px 16px 16px 14px;
  grid-template-columns:18px 54px minmax(0,1fr) auto;
  gap:10px;
  overflow:visible;
  border:0;
  border-top:1px solid color-mix(in srgb,var(--accent) 21%,var(--line));
  border-bottom:1px solid color-mix(in srgb,var(--line) 76%,transparent);
  border-radius:0;
  background:linear-gradient(100deg,color-mix(in srgb,var(--panel-strong) 48%,transparent),transparent 84%);
  box-shadow:none;
  isolation:auto;
}
.correspondence-entry:before{
  content:"";
  position:absolute;
  left:0;
  top:-1px;
  width:48px;
  height:1px;
  background:var(--accent);
  opacity:.72;
}
.correspondence-entry:after{
  content:"";
  position:absolute;
  right:7px;
  bottom:8px;
  width:35px;
  height:22px;
  opacity:.16;
  background:radial-gradient(circle,var(--accent) 0 1px,transparent 1.4px) 0 0/7px 7px;
  pointer-events:none;
}
.correspondence-no{
  align-self:start;
  padding-top:3px;
  color:color-mix(in srgb,var(--muted) 75%,transparent);
  font:500 .52rem/1 "SFMono-Regular",Consolas,monospace;
  letter-spacing:.08em;
}
.correspondence-entry .contact-avatar{
  width:54px;
  height:54px;
  border:1px solid rgba(255,255,255,.86);
  box-shadow:0 5px 14px rgba(var(--shadow-rgb),.075);
}
.correspondence-entry .contact-name{gap:7px}
.correspondence-entry .contact-name b{
  font:600 1.08rem/1.2 "PingFang SC","Songti SC",serif;
  letter-spacing:.025em;
}
.correspondence-entry .contact-name span{
  font-size:.6rem;
  letter-spacing:.03em;
}
.correspondence-entry .contact-preview{
  margin-top:9px;
  color:color-mix(in srgb,var(--ink) 72%,var(--muted));
  font:400 .78rem/1.5 "PingFang SC","Songti SC",serif;
}
.correspondence-caption{
  display:block;
  margin-top:7px;
  color:color-mix(in srgb,var(--muted) 72%,transparent);
  font:italic .58rem/1.2 Georgia,serif;
  letter-spacing:.07em;
}
.correspondence-entry .contact-side{
  align-self:start;
  align-items:flex-start;
  padding-top:2px;
}
.correspondence-entry .contact-side-meta{gap:6px}
.correspondence-entry .contact-side time{
  font:.55rem/1.1 "Avenir Next","Helvetica Neue",sans-serif;
  letter-spacing:.04em;
}
.correspondence-entry .contact-channel{
  font-size:.54rem;
  letter-spacing:.12em;
}
.correspondence-entry .contact-side>svg{
  align-self:center;
  margin-top:19px;
  width:14px;
  height:14px;
  opacity:.7;
}

/* The body account is a dated body note, not a dashboard. */
#homeQuest.quest-card{
  position:relative;
  overflow:hidden;
  padding:21px 21px 8px;
  border:1px solid color-mix(in srgb,var(--accent) 12%,var(--glass-edge));
  border-radius:28px 28px 35px 23px;
  background:
    linear-gradient(118deg,var(--glass-highlight),transparent 46%),
    color-mix(in srgb,var(--panel-strong) 67%,transparent);
  box-shadow:inset 0 1px 0 var(--glass-highlight),0 14px 34px rgba(var(--shadow-rgb),.045);
}
#homeQuest.quest-card:before{
  content:"BODY / TODAY";
  position:absolute;
  right:-4px;
  top:86px;
  color:color-mix(in srgb,var(--accent) 26%,transparent);
  font:600 .47rem/1 "Avenir Next","Helvetica Neue",sans-serif;
  letter-spacing:.2em;
  transform:rotate(90deg);
  transform-origin:center;
}
#homeQuest.quest-card:after{
  content:"";
  position:absolute;
  right:18px;
  top:20px;
  width:45px;
  height:31px;
  opacity:.16;
  background:radial-gradient(circle,var(--accent) 0 1px,transparent 1.4px) 0 0/7px 7px;
  pointer-events:none;
}
#homeQuest .body-note-head{
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding-bottom:14px;
  border-bottom:1px solid color-mix(in srgb,var(--line) 80%,transparent);
}
#homeQuest .body-note-head .section-label{
  font-size:.63rem;
  letter-spacing:.09em;
}
#homeQuest .body-note-head h2{
  margin:5px 0 0;
  font:600 1.08rem/1.2 "PingFang SC","Songti SC",serif;
  letter-spacing:.03em;
}
#homeQuest .body-note-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:.68rem;
}
#homeQuest .body-note-points{
  min-width:54px;
  display:grid;
  grid-template-columns:auto auto;
  justify-content:end;
  align-items:baseline;
  column-gap:3px;
  text-align:right;
}
#homeQuest .body-note-points b{
  color:var(--accent-deep,var(--accent));
  font:500 1.42rem/1 Georgia,"Songti SC",serif;
  font-variant-numeric:lining-nums tabular-nums;
}
#homeQuest .body-note-points span{color:var(--muted);font-size:.62rem}
#homeQuest .body-note-points small{
  grid-column:1/-1;
  margin-top:4px;
  color:color-mix(in srgb,var(--muted) 78%,transparent);
  font:italic .54rem/1.2 Georgia,serif;
}
#homeQuest .body-note-ledger{padding:17px 1px 2px}
#homeQuest .body-note-hero span{
  display:block;
  color:var(--muted);
  font-size:.7rem;
  letter-spacing:.03em;
}
#homeQuest .body-note-hero p{
  display:flex;
  align-items:baseline;
  gap:7px;
  margin:1px 0 1px;
}
#homeQuest .body-note-hero strong{
  color:var(--accent-deep,var(--accent));
  font:400 clamp(2.95rem,14vw,4rem)/.98 "Bodoni 72","Didot",Georgia,serif;
  letter-spacing:-.045em;
  font-variant-numeric:lining-nums tabular-nums;
}
#homeQuest .body-note-hero strong.over{color:var(--danger)}
#homeQuest .body-note-hero em{
  color:var(--muted);
  font:normal .68rem/1 "PingFang SC",sans-serif;
  letter-spacing:.08em;
}
#homeQuest .body-note-hero small{
  display:block;
  color:color-mix(in srgb,var(--muted) 86%,transparent);
  font:italic .65rem/1.5 Georgia,"Songti SC",serif;
}
#homeQuest .body-note-scale{
  position:relative;
  height:12px;
  margin:13px 0 8px;
  border-top:1px solid color-mix(in srgb,var(--muted) 22%,transparent);
}
#homeQuest .body-note-scale:before,
#homeQuest .body-note-scale:after{
  content:"";
  position:absolute;
  top:-3px;
  width:1px;
  height:6px;
  background:color-mix(in srgb,var(--muted) 28%,transparent);
}
#homeQuest .body-note-scale:before{left:0}
#homeQuest .body-note-scale:after{right:0}
#homeQuest .body-note-scale i{
  position:absolute;
  left:0;
  top:-1px;
  width:var(--body-used);
  height:2px;
  border-radius:99px;
  background:var(--accent);
}
#homeQuest .body-note-scale b{
  position:absolute;
  left:clamp(2px,var(--body-used),calc(100% - 4px));
  top:-4px;
  width:7px;
  height:7px;
  border:1px solid var(--panel-strong);
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1);
  transform:translateX(-50%);
}
#homeQuest .body-note-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
}
#homeQuest .body-note-facts dl{
  margin:0;
  padding:0 10px;
  border-left:1px solid color-mix(in srgb,var(--line) 76%,transparent);
}
#homeQuest .body-note-facts dl:first-child{padding-left:0;border-left:0}
#homeQuest .body-note-facts dt{color:var(--muted);font-size:.62rem}
#homeQuest .body-note-facts dd{
  margin:4px 0 0;
  color:var(--ink);
  font:600 .93rem/1 "Avenir Next","PingFang SC",sans-serif;
  font-variant-numeric:tabular-nums;
}
#homeQuest .body-note-detail{
  margin:10px 0 0;
  color:color-mix(in srgb,var(--muted) 76%,transparent);
  font-size:.57rem;
  line-height:1.45;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#homeQuest .body-note-lines{
  margin-top:12px;
  border-top:1px solid color-mix(in srgb,var(--line) 82%,transparent);
}
#homeQuest .body-note-line{
  min-height:45px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto auto;
  align-items:center;
  gap:9px;
  border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}
#homeQuest .body-note-line>span{color:var(--muted);font-size:.68rem}
#homeQuest .body-note-line>p{
  margin:0;
  color:var(--ink);
  font-size:.72rem;
  white-space:nowrap;
}
#homeQuest .body-note-line>small{
  color:var(--muted);
  font-size:.56rem;
  white-space:nowrap;
}
#homeQuest .body-note-line-track{
  height:3px;
  border-radius:99px;
  background:rgba(var(--accent-rgb),.1);
  overflow:hidden;
}
#homeQuest .body-note-line-track i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--accent);
}
#homeQuest .body-note-drops{display:flex;gap:4px;min-width:0}
#homeQuest .body-note-drops i{
  flex:1;
  height:5px;
  border-radius:99px;
  background:rgba(var(--accent-rgb),.1);
}
#homeQuest .body-note-drops i.on{background:var(--accent)}
#homeQuest .body-note-plus{
  width:32px;
  height:27px;
  border:0;
  border-radius:999px;
  background:rgba(var(--accent-rgb),.11);
  color:var(--accent-deep,var(--accent));
  font:600 .68rem/1 "Avenir Next",sans-serif;
}
#homeQuest .body-note-plus:active{transform:scale(.94)}
#homeQuest .q-expand{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:0;
  border:0;
  background:none;
  color:var(--ink);
  font-size:.7rem;
}
#homeQuest .q-expand span{flex:1;text-align:left}
#homeQuest .q-expand em{color:var(--muted);font-size:.62rem;font-style:normal}
#homeQuest .q-expand:after{
  content:"";
  width:6px;
  height:6px;
  margin:-3px 3px 0 1px;
  border-right:1px solid var(--muted);
  border-bottom:1px solid var(--muted);
  transform:rotate(45deg);
  transition:transform .2s ease,margin .2s ease;
}
#homeQuest .q-expand[aria-expanded="true"]:after{margin-top:3px;transform:rotate(225deg)}
#homeQuest .q-extra{padding-bottom:9px;border-top:1px solid var(--line)}

@media(max-width:370px){
  .contacts-page{padding-left:16px;padding-right:16px}
  .correspondence-entry.contact-row{grid-template-columns:52px minmax(0,1fr) auto;padding-left:12px}
  .correspondence-no{display:none}
  #homeQuest.quest-card{padding-left:18px;padding-right:18px}
  #homeQuest .body-note-line{grid-template-columns:34px minmax(0,1fr) auto}
  #homeQuest .body-note-line>small{display:none}
}
@media(max-width:430px){
  #homeQuest .body-note-weight>small{display:none}
}

/* Contact surface rollback: keep the body note above, restore the original
   contacts header, spacing and card language exactly. */
.app[data-route="chat"]:not(.chat-detail) .app-header{
  min-height:calc(var(--safe-top) + 104px);
  padding:calc(var(--safe-top) + 23px) 22px 14px;
}
.app[data-route="chat"]:not(.chat-detail) .eyebrow{
  font:italic .86rem Georgia,"Songti SC",serif;
  letter-spacing:.055em;
  text-transform:none;
}
.app[data-route="chat"]:not(.chat-detail) .app-header h1{
  margin:5px 0 0;
  font:400 clamp(1.9rem,7.4vw,2.55rem)/1.08 Georgia,"Songti SC",serif;
  letter-spacing:-.035em;
  white-space:normal;
}
.app[data-route="chat"]:not(.chat-detail) .icon-btn{
  width:34px;
  height:34px;
  border-color:var(--glass-edge);
  background:var(--panel);
  box-shadow:0 6px 18px rgba(var(--shadow-rgb),.055),inset 0 1px 0 var(--glass-highlight);
}
.contacts-page{
  padding-top:calc(var(--safe-top) + 118px);
  padding-left:18px;
  padding-right:18px;
}
.contact-list{gap:12px}