*{box-sizing:border-box}body{margin:0;background:#f3f6f4;color:#19332b;font-family:system-ui,-apple-system,"Hiragino Sans",sans-serif}.portal-header{position:sticky;top:0;z-index:5;min-height:62px;padding:6px 12px;background:#173f35;color:#fff;display:flex;align-items:center;justify-content:center}.portal-brand{display:grid;justify-items:center;gap:4px;width:min(128px,28vw);color:#fff;text-decoration:none}.portal-brand img{display:block;width:100%;height:auto;max-height:24px;object-fit:contain}.portal-brand small{display:block;color:#d5e4df;font-size:.62rem;letter-spacing:.08em;line-height:1}.company-pill{position:absolute;right:14px;top:50%;transform:translateY(-50%);max-width:24vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;background:#ffffff1c;padding:5px 9px;border-radius:999px}.portal-main{width:min(760px,calc(100% - 28px));margin:22px auto 90px}.hero-card,.panel,.empty{background:#fff;border-radius:22px;padding:26px;box-shadow:0 12px 32px #173f3510}.hero-card{margin-top:5vh;text-align:center}.hero-card h1{font-size:clamp(1.15rem,4.5vw,1.38rem);line-height:1.45;word-break:keep-all;overflow-wrap:break-word}.eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.14em;color:#4f7c6c}.primary,.bottom-nav button{border:0;border-radius:12px;background:#173f35;color:white;padding:12px 18px;text-decoration:none;font:inherit}.big{width:100%;padding:16px;font-weight:800;font-size:1.05rem}.help,.muted{color:#6b7d76;font-size:.9rem}.status{min-height:26px;margin-top:12px}.feature-list{text-align:left;line-height:2}.welcome{padding:6px 4px 12px}.welcome h1{margin:.15em 0;font-size:clamp(1.1rem,4.2vw,1.32rem);line-height:1.45;word-break:keep-all;overflow-wrap:break-word}.portal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}.action-card{background:#fff;border-radius:18px;padding:20px;text-decoration:none;color:inherit;display:grid;gap:6px;box-shadow:0 8px 26px #173f350c}.action-card span{font-size:1.6rem}.action-card small{color:#6b7d76}.panel{margin:14px 0}.panel h2{font-size:1.05rem}.list-row{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-top:1px solid #e9efec;text-decoration:none;color:inherit}.list-row small{display:block;color:#83928c;margin-top:4px}.list-row em{font-style:normal;font-size:.75rem}.page-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.page-head h1{margin:.2em 0}.thread-list{display:grid;gap:10px}.thread-list a{display:grid;gap:5px;background:#fff;padding:18px;border-radius:16px;text-decoration:none;color:inherit}.thread-list span{font-size:.82rem;color:#7a8a84}.stack{display:grid;gap:14px}label{display:grid;gap:6px;font-weight:700}input,textarea,select{width:100%;border:1px solid #cad6d1;border-radius:12px;padding:13px;font:inherit;background:#fff}.chat-box{display:grid;gap:10px;padding:10px 0 18px}.bubble-row{display:flex}.bubble-row.mine{justify-content:flex-end}.bubble{max-width:82%;padding:12px 15px;border-radius:17px;background:#fff;box-shadow:0 4px 16px #173f3509}.mine .bubble{background:#dff4e8}.bubble p{margin:0 0 5px}.bubble small{font-size:.68rem;color:#7b8a85}.chat-input{position:sticky;bottom:62px;background:#f3f6f4;padding:10px 0;display:grid;grid-template-columns:1fr auto;gap:8px}.chat-input textarea{resize:none}.status-chip{background:#e1eee9;padding:7px 10px;border-radius:999px;font-size:.75rem}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:5;display:grid;grid-template-columns:1fr 1fr 1fr;background:#fff;border-top:1px solid #dfe7e3;padding:max(8px,env(safe-area-inset-bottom)) 8px}.bottom-nav a,.bottom-nav form,.bottom-nav button{display:flex;justify-content:center;align-items:center;text-decoration:none;color:#294b40}.bottom-nav button{background:none;padding:8px;color:#294b40}.flash{padding:12px;border-radius:12px;margin-bottom:12px}.flash-success{background:#dcfce7}.flash-error{background:#fee2e2}.flash-info{background:#dbeafe}.flash-warning{background:#fef3c7}@media(max-width:520px){.portal-grid{grid-template-columns:1fr}.hero-card{margin-top:2.5vh;padding:22px}}


@media(max-width:520px){.portal-header{min-height:58px;padding:6px 12px}.portal-brand{width:min(112px,34vw);gap:4px}.portal-brand img{max-height:20px}.portal-brand small{font-size:.58rem}.company-pill{right:8px;max-width:22vw;padding:4px 6px;font-size:.64rem}.hero-card h1,.welcome h1{font-size:clamp(1rem,4.6vw,1.22rem)}}

/* v0.1.11: mobile brand/header scale and customer company heading */
.portal-brand{width:min(150px,32vw)}
.portal-brand img{max-height:30px}
.welcome h1{font-size:clamp(1.15rem,3.5vw,1.35rem);line-height:1.4;font-weight:750;word-break:keep-all;overflow-wrap:anywhere}
.hero-card h1{font-size:clamp(1.15rem,3.5vw,1.35rem);line-height:1.4;font-weight:750;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:520px){
  .portal-header{min-height:56px;padding:5px 12px}
  .portal-brand{width:112px;max-width:32vw;gap:2px;margin-inline:auto}
  .portal-brand img{width:100%;max-height:30px}
  .portal-brand small{font-size:.54rem;line-height:1;letter-spacing:.06em}
  .company-pill{display:none}
  .portal-main{margin-top:18px}
  .welcome{padding-top:4px}
  .welcome h1{font-size:1.18rem;line-height:1.35;margin:.2em 0 .45em}
  .hero-card h1{font-size:1.18rem;line-height:1.35}
}

/* v0.1.12: one personal inquiry chat per portal user */
.portal-grid-single{grid-template-columns:1fr}.inquiry-entry{min-height:112px;align-content:center}.inquiry-entry strong{font-size:1.15rem}
.personal-chat{display:flex;flex-direction:column;min-height:calc(100dvh - 62px - 90px);background:#e8efec;border-radius:22px;overflow:hidden;box-shadow:0 12px 32px #173f3510}
.chat-partner{display:flex;align-items:center;gap:12px;margin:0;padding:13px 16px;background:#fff;border-bottom:1px solid #dfe7e3}
.chat-partner-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#173f35;color:#fff;font-weight:800;font-family:Georgia,serif}
.chat-partner h1{margin:0;font-size:1rem;line-height:1.25}.chat-partner p{margin:3px 0 0;font-size:.76rem;color:#70817a}
.chat-timeline{flex:1;display:grid;align-content:end;gap:10px;padding:18px 14px 12px;min-height:360px}
.chat-empty{align-self:center;justify-self:center;max-width:440px;padding:20px;text-align:center;color:#60756d}.chat-empty strong{display:block;margin-bottom:8px;color:#294b40}.chat-empty p{margin:0;font-size:.88rem;line-height:1.7}
.bubble-row{display:flex}.bubble-row.mine{justify-content:flex-end}.bubble{max-width:min(78%,520px);padding:10px 13px;border-radius:18px;background:#fff;box-shadow:0 2px 8px #173f350b}.mine .bubble{background:#bde9c9;border-bottom-right-radius:5px}.theirs .bubble{border-bottom-left-radius:5px}.bubble-sender{display:block;margin-bottom:3px;font-size:.7rem;font-weight:700;color:#587168}.bubble p{margin:0 0 4px;line-height:1.55;overflow-wrap:anywhere}.bubble small{display:block;text-align:right;font-size:.64rem;color:#75867f}
.line-composer{position:sticky;bottom:61px;z-index:3;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;margin:0;padding:10px 12px max(10px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid #dfe7e3}
.line-composer textarea{min-height:44px;max-height:120px;padding:10px 12px;border-radius:22px;resize:none;background:#f6f8f7}.chat-send{height:44px;border:0;border-radius:22px;padding:0 16px;background:#173f35;color:#fff;font:inherit;font-weight:800}
@media(max-width:520px){.portal-main{width:100%;margin:14px auto 72px}.portal-main>.welcome,.portal-main>.portal-grid,.portal-main>.panel,.portal-main>.flash{width:calc(100% - 28px);margin-left:auto;margin-right:auto}.personal-chat{min-height:calc(100dvh - 56px - 64px - 14px);border-radius:0;box-shadow:none}.chat-timeline{min-height:calc(100dvh - 240px);padding-inline:12px}.line-composer{bottom:61px}.bubble{max-width:82%}}

/* Keep the conversation itself scrollable like a messaging app. */
.personal-chat{height:min(760px,calc(100dvh - 175px));min-height:520px}
.chat-timeline{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.line-composer{position:static;bottom:auto;flex:0 0 auto}
@media(max-width:520px){.personal-chat{height:calc(100dvh - 56px - 61px - 14px);min-height:0}.chat-timeline{min-height:0}.line-composer{bottom:auto}}


/* v0.1.13: keep the chat composer clear of the fixed bottom navigation. */
body.has-personal-chat{overflow:hidden}
body.has-personal-chat .portal-main{margin-bottom:0}
body.has-personal-chat .personal-chat{height:var(--chat-available-height,calc(100dvh - 140px));min-height:0}
body.has-personal-chat .chat-timeline{min-height:0;overflow-y:auto;overscroll-behavior:contain}
body.has-personal-chat .line-composer{position:static;bottom:auto;flex:0 0 auto;margin:0}
body.chat-composing .bottom-nav{display:none}
@media(max-width:520px){
  body.has-personal-chat .portal-main{margin-bottom:0;padding-bottom:0}
  body.has-personal-chat .personal-chat{height:var(--chat-available-height,calc(100dvh - 140px));min-height:0}
  body.has-personal-chat .line-composer{padding-bottom:max(10px,env(safe-area-inset-bottom))}
}

/* v0.1.14: message recall + Android textarea scrollbar cleanup */
.line-composer textarea{
  overflow-y:hidden;
  scrollbar-width:none;
}
.line-composer textarea::-webkit-scrollbar{display:none;width:0;height:0}
.bubble-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:2px}
.bubble-meta small{display:block;text-align:right}
.message-recall-form{margin:0;display:inline-flex}
.message-recall-button{
  appearance:none;
  border:0;
  background:transparent;
  color:#64756f;
  padding:0;
  font:inherit;
  font-size:.66rem;
  line-height:1.4;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
.bubble-recalled{background:#eef2f0!important;color:#718078;box-shadow:none;border:1px solid #d9e1dd}
.recalled-text{margin:0!important;font-size:.82rem;font-style:italic;color:#718078}
.bubble-row.recalled .bubble-meta{margin-top:4px}

/* v0.1.15: PWA notifications, unread badges and compact chat bubbles. */
[hidden]{display:none!important}
.portal-notification-button{
  position:absolute;left:12px;top:50%;transform:translateY(-50%);z-index:2;
  display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #ffffff42;
  border-radius:50%;background:#ffffff12;color:#fff;font-size:1rem;line-height:1;cursor:pointer;
}
.portal-notification-button[data-state="on"]{background:#ffffff22}
.portal-notification-button[data-state="denied"]{opacity:.5}
.portal-notification-button b{
  position:absolute;top:-5px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  display:grid;place-items:center;background:#dc2626;color:#fff;border:2px solid #173f35;
  font-size:.6rem;line-height:1;font-weight:800;
}
.nav-inquiry-link{gap:6px}
.nav-unread-badge,.menu-unread-badge{
  display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;
  background:#dc2626;color:#fff;font-size:.66rem;font-weight:800;line-height:1;
}
.menu-unread-badge{vertical-align:middle;margin-left:4px}
.bubble-row{align-items:flex-start}
.bubble{
  width:fit-content;height:auto!important;min-height:0!important;align-self:flex-start;
  padding:8px 12px 7px;
}
.bubble p{margin:0!important;line-height:1.5}
.bubble-sender{margin-bottom:2px}
.bubble-meta{margin-top:3px;line-height:1.1}
.bubble-meta small{line-height:1.1}
@media(max-width:520px){
  .portal-notification-button{left:8px;width:36px;height:36px;font-size:.95rem}
  .bubble{padding:7px 11px 6px}
}


/* v0.1.17: compact unread badge inside the inquiry home card. */
.inquiry-entry strong{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}
.inquiry-entry .menu-unread-badge{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  min-width:19px;
  width:auto;
  height:19px;
  margin:0;
  padding:0 5px;
  border-radius:999px;
  background:#dc2626;
  color:#fff;
  font-size:.66rem!important;
  font-weight:800;
  line-height:1!important;
  vertical-align:middle;
}


/* v0.1.20: Enter-to-send preference */
.chat-send-stack{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;gap:5px}
.enter-send-option{display:flex!important;grid-template-columns:none!important;flex-direction:row!important;align-items:center!important;gap:5px!important;margin:0!important;color:#6b7280;font-size:.68rem!important;font-weight:600!important;line-height:1.15;white-space:nowrap;cursor:pointer;user-select:none}
.enter-send-option input{width:auto!important;min-width:0!important;margin:0!important;padding:0!important;accent-color:#173f35}
.enter-send-option span{font-size:inherit!important;line-height:inherit!important}
@media(max-width:520px){.chat-send-stack{gap:4px}.enter-send-option{font-size:.64rem!important}}


/* v0.1.21: tappable targeted announcements */
.announcement-list{display:grid;gap:0;margin:0 -4px}
.announcement-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 8px;border-top:1px solid #e3ebe7;color:#173f35;text-decoration:none}
.announcement-row:first-child{border-top:0}
.announcement-row:hover,.announcement-row:focus-visible{background:#f3f8f6}
.announcement-row span{display:grid;gap:4px;min-width:0}
.announcement-row strong{font-size:.95rem;line-height:1.45;overflow-wrap:anywhere}
.announcement-row small{color:#75867f;font-size:.72rem}
.announcement-row>b{flex:0 0 auto;color:#7b8f87;font-size:1.45rem;font-weight:400}
.announcement-detail{display:block}
.announcement-detail .announcement-back{display:inline-block;margin-bottom:18px;color:#315e50;text-decoration:none;font-size:.82rem;font-weight:700}
.announcement-detail .eyebrow{margin:0 0 7px;color:#4f806f;font-size:.72rem;font-weight:800;letter-spacing:.12em}
.announcement-detail h1{margin:0 0 8px;color:#173f35;font-size:clamp(1.25rem,5vw,1.8rem);line-height:1.35;overflow-wrap:anywhere}
.announcement-detail time{display:block;margin-bottom:22px;color:#75867f;font-size:.76rem}
.announcement-body{padding-top:18px;border-top:1px solid #e3ebe7;color:#294b40;line-height:1.9;overflow-wrap:anywhere}
@media(max-width:520px){.announcement-panel{padding:18px}.announcement-row{padding:13px 4px}.announcement-detail{width:calc(100% - 28px);margin-left:auto;margin-right:auto;padding:20px 18px}.announcement-body{font-size:.94rem}}
