/* VIVI Canonical Profile presentation — 0.13.198
 * One DOM/presentation contract for full Profile pages and embedded Profile surfaces.
 * Breakpoints are based on the Profile container, never the browser viewport.
 */
.vivi-profile-canonical {
  --vivi-profile-section-gap: var(--vivi-space-md, 16px);
  width: 100%;
  min-width: 0;
  padding: 0 !important;
  margin: 0 auto;
  box-sizing: border-box;
  container-type: inline-size;
  container-name: vivi-profile;
}

.vivi-profile-main {
  width: min(100%, var(--vivi-container, 1320px)) !important;
  max-width: var(--vivi-container, 1320px) !important;
  margin-inline: auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.vivi-profile-surface {
  width: 100%;
  max-width: none;
  padding: 0 !important;
  margin: 0;
}


.vivi-profile-surface-host {
  display:block;
  width:100%;
  min-width:0;
  padding:0;
  margin:0;
  box-sizing:border-box;
}
.vivi-profile-surface-host.is-loading { min-height:min(420px,calc(100vh - 260px)); }

/* Life Explore embedded Profile owns its internal spacing. */
.vivi-profile-surface-body {
  padding: 0 !important;
}

/* Hero */
.vivi-profile-hero {
  width: 100%;
  margin: 0;
  border: 1px solid var(--vivi-color-border, #dedede);
  border-radius: 0;
  overflow: hidden;
  background: var(--vivi-color-card, #fff);
  box-sizing: border-box;
}

.vivi-profile-cover-shell,
.vivi-profile-cover {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
}

.vivi-profile-cover {
  aspect-ratio: 1950 / 450 !important;
  overflow: hidden !important;
  background: var(--vivi-color-bg-soft, #f6f3ee) !important;
}

.vivi-profile-cover:not(.has-cover-image)::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(224,214,199,.6), rgba(255,255,255,.86));
}

.vivi-profile-cover-img {
  position: absolute !important;
  top: var(--vivi-profile-cover-top, 0px) !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  object-fit: initial !important;
  object-position: initial !important;
  transform: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}

.vivi-profile-cover-media-actions {
  position: absolute !important;
  top: var(--vivi-space-md, 16px) !important;
  right: var(--vivi-space-md, 16px) !important;
  z-index: 6 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.vivi-profile-media-action {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: var(--vivi-radius, 8px) !important;
  background: rgba(255,255,255,.94) !important;
  color: var(--vivi-color-heading, #1e1e1e) !important;
  box-shadow: var(--vivi-shadow-sm, 0 8px 24px rgba(0,0,0,.12)) !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.vivi-profile-cover-reposition-bar {
  position: absolute !important;
  left: 50% !important;
  bottom: var(--vivi-space-md, 16px) !important;
  z-index: 7 !important;
  transform: translateX(-50%) !important;
  display: none !important;
  align-items: center !important;
  gap: 10px !important;
  width: min(calc(100% - 32px), 680px) !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: var(--vivi-radius, 8px) !important;
  background: rgba(255,255,255,.95) !important;
  box-shadow: var(--vivi-shadow-md, 0 16px 40px rgba(0,0,0,.16)) !important;
  box-sizing: border-box !important;
}
.vivi-profile-cover-reposition-bar button { appearance:none; border:1px solid var(--vivi-color-border,#ddd); border-radius:var(--vivi-radius,8px); background:#fff; padding:8px 14px; cursor:pointer; }
.vivi-profile-cover-reposition-bar [data-vivi-profile-cover-save] { background:var(--vivi-color-heading,#111); border-color:var(--vivi-color-heading,#111); color:#fff; }
.vivi-profile-cover.is-repositioning { cursor: ns-resize !important; }
.vivi-profile-cover.is-repositioning .vivi-profile-cover-reposition-bar { display: inline-flex !important; }
.vivi-profile-cover.is-repositioning .vivi-profile-cover-media-actions { display: none !important; }

.vivi-profile-hero-body {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: var(--vivi-space-lg, 24px);
  align-items: start;
  padding: var(--vivi-space-lg, 24px) var(--vivi-space-xl, 32px) var(--vivi-space-xl, 32px);
  box-sizing: border-box;
}

.vivi-profile-hero-avatar-column {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 88px;
  min-width: 88px;
}

.vivi-profile-avatar {
  position: relative;
  display: block;
  width: 88px;
  height: 88px;
  overflow: hidden;
  border: 1px solid var(--vivi-color-border, #dedede);
  border-radius: var(--vivi-radius, 8px);
  background: #fff;
  box-sizing: border-box;
}
.vivi-profile-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.vivi-profile-avatar.can-manage-media { overflow: visible; }
.vivi-profile-avatar-edit-link { position:relative; display:block; width:100%; height:100%; border-radius:inherit; text-decoration:none; color:inherit; }
.vivi-profile-avatar-edit-icon { position:absolute; right:-4px; bottom:-4px; z-index:4; width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.78); border-radius:var(--vivi-radius,8px); background:#fff; box-shadow:var(--vivi-shadow-sm,0 8px 24px rgba(0,0,0,.12)); }

.vivi-profile-hero-copy { min-width: 0; width: 100%; }
.vivi-profile-hero-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: var(--vivi-space-lg, 24px);
  align-items: start;
}
.vivi-profile-hero-titleblock { min-width:0; }
.vivi-profile-hero-titleblock h1 { margin:0 0 8px; color:var(--vivi-color-heading,#1e1e1e); font-family:var(--vivi-font-heading,inherit); font-size:var(--vivi-fs-h2,30px); line-height:1.25; font-weight:700; }
.vivi-profile-hero-meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:8px; }
.vivi-profile-hero-meta > span { display:inline-flex; align-items:center; min-height:26px; padding:0 10px; border-radius:var(--vivi-radius,8px); background:var(--vivi-color-bg-soft,#f5f5f5); color:var(--vivi-color-text-muted,#777); font-size:var(--vivi-fs-xs,12px); }
.vivi-profile-hero-description { margin:16px 0 0; color:var(--vivi-color-text,#555); }

.vivi-profile-hero-actions.vivi-loop-action-icons {
  position: static !important;
  display: inline-flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--vivi-profile-hero-action-gap, 10px) !important;
  width: max-content !important;
  max-width: max-content !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}
.vivi-profile-hero-actions.vivi-loop-action-icons > .vivi-loop-action-icon,
.vivi-profile-hero-actions.vivi-loop-action-icons .vivi-profile-hero-action {
  flex: 0 0 auto !important;
}
.vivi-profile-hero-action-label,
.vivi-profile-admin-switch-label,
.vivi-profile-hero-actions .vivi-profile-follow-label { display:none !important; }


.vivi-profile-follow-label,
.vivi-profile-loop-share-label {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Tabs — same renderer for full page links and embedded AJAX buttons. */
.vivi-profile-page-nav.vivi-profile-section-nav.vivi-page-tabs-list {
  flex-wrap: nowrap;
  overflow-x: hidden;
}

.vivi-profile-tabs.vivi-profile-page-nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--vivi-color-border, #dedede) !important;
  border-top: 0 !important;
  border-radius: 0 !important;
  background: var(--vivi-color-card, #fff) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.vivi-profile-tabs > .vivi-profile-tab.vivi-page-tab {
  flex: 1 1 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--vivi-color-text, #555) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
.vivi-profile-tabs > .vivi-profile-tab.is-active { margin:7px !important; min-height:44px !important; border-radius:var(--vivi-radius,8px) !important; background:var(--vivi-color-heading,#111) !important; color:#fff !important; font-weight:700 !important; }

.vivi-profile-canonical-content { width:100%; min-width:0; margin-top:var(--vivi-profile-section-gap,16px); padding:0 !important; box-sizing:border-box; }
.vivi-profile-canonical-section { width:100%; min-width:0; margin:0; padding:0 !important; box-sizing:border-box; }
.vivi-profile-canonical-loading,
.vivi-profile-canonical-error,
.vivi-profile-canonical-empty { width:100%; padding:24px; box-sizing:border-box; text-align:center; }

/* Canonical section surfaces. Outer frame is deliberately square. */
.vivi-profile-list-panel {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid var(--vivi-color-border, #dedede);
  border-radius: 0 !important;
  background: var(--vivi-color-card, #fff);
  box-shadow: none;
  overflow: hidden;
  box-sizing: border-box;
}
.vivi-profile-list-panel__header { display:flex; align-items:center; justify-content:center; min-height:54px; padding:12px 18px; border-bottom:1px solid var(--vivi-color-border,#dedede); text-align:center; box-sizing:border-box; }
.vivi-profile-list-panel__body { width:100%; padding:18px; box-sizing:border-box; }
.vivi-profile-list-panel__title { margin:0 0 16px; font-size:var(--vivi-fs-h3,20px); color:var(--vivi-color-heading,#111); }
.vivi-profile-family-rewards-component > .vivi-profile-list-panel + .vivi-profile-list-panel { margin-top:var(--vivi-space-md,16px); }

.vivi-profile-commerce-grid,
.vivi-profile-deals-grid,
.vivi-profile-ticket-content .vivi-ticket-grid {
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:16px !important;
  width:100% !important;
  min-width:0 !important;
  padding:0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.vivi-profile-commerce-card { min-width:0; }
.vivi-profile-commerce-card__placeholder { display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1/1; background:var(--vivi-color-bg-soft,#f5f5f5); color:var(--vivi-color-text-muted,#777); }

.vivi-profile-reward-rule-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.vivi-profile-reward-rule-grid.is-single-mode { grid-template-columns:1fr; }
.vivi-profile-reward-rule { display:flex; flex-direction:column; gap:8px; min-height:82px; padding:16px; background:var(--vivi-color-bg-soft,#f5f5f5); box-sizing:border-box; }
.vivi-profile-reward-rule:first-child:last-child,
.vivi-profile-reward-rule-grid:not(.is-single-mode) .vivi-profile-reward-rule:first-child { grid-column:1 / -1; }
.vivi-profile-reward-rule span { color:var(--vivi-color-text-muted,#777); font-size:var(--vivi-fs-small,14px); }
.vivi-profile-reward-rule strong { color:var(--vivi-color-heading,#111); }
.vivi-profile-reward-rule-note { margin:12px 0 0; color:var(--vivi-color-text-muted,#777); line-height:1.7; }

/* Intro owns its inner card spacing; the Profile shell contributes no padding. */
/* Profile intro base presentation (moved from Groups in 0.13.190). */
.vivi-profile-intro-panel {
  width: 100%;
  max-width: none;
  margin: var(--vivi-space-lg) 0 0;
  display: grid;
  gap: var(--vivi-space-lg);
  box-sizing: border-box;
}

.vivi-profile-intro-card {
  background: var(--vivi-color-card);
  border: 1px solid var(--vivi-color-border);
  border-radius: var(--vivi-radius, 8px);
  box-shadow: var(--vivi-shadow-soft);
  padding: clamp(var(--vivi-space-lg), 3vw, var(--vivi-space-xl));
}


.vivi-profile-intro-card-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--vivi-space-md);
  margin: 0 0 var(--vivi-space-sm);
}

.vivi-profile-intro-card .vivi-profile-intro-card-heading h2 {
  margin: 0;
}

.vivi-profile-intro-edit-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid var(--vivi-color-border);
  border-radius: var(--vivi-radius, 8px);
  background: var(--vivi-color-card);
  color: var(--vivi-color-heading);
  font-family: var(--vivi-font-body);
  font-size: var(--vivi-fs-small);
  font-weight: var(--vivi-fw-bold);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.vivi-profile-intro-edit-link:hover,
.vivi-profile-intro-edit-link:focus-visible {
  border-color: var(--vivi-color-accent);
  background: var(--vivi-color-accent-soft, rgba(166, 104, 7, 0.08));
  color: var(--vivi-color-accent);
  outline: none;
}

.vivi-profile-intro-edit-link i {
  font-size: 18px;
  line-height: 1;
}

.vivi-profile-intro-card h2 {
  margin: 0 0 var(--vivi-space-sm);
  color: var(--vivi-color-heading);
  font-family: var(--vivi-font-heading);
  font-size: var(--vivi-fs-h3);
  font-weight: var(--vivi-fw-bold);
  line-height: var(--vivi-lh-heading);
  letter-spacing: -0.02em;
}

.vivi-profile-intro-card p,
.vivi-profile-intro-description {
  margin: 0;
  color: var(--vivi-color-text-muted);
  font-family: var(--vivi-font-body);
  font-size: var(--vivi-fs-body);
  font-weight: var(--vivi-fw-regular);
  line-height: var(--vivi-lh-body);
}

.vivi-profile-intro-description p {
  margin: 0 0 0.85em;
}

.vivi-profile-intro-description p:last-child {
  margin-bottom: 0;
}

.vivi-profile-intro-description :where(strong, b) {
  font-weight: var(--vivi-fw-bold);
}

.vivi-profile-intro-description :where(em, i) {
  font-style: italic;
}

.vivi-profile-intro-description :where(ul, ol) {
  margin: 0 0 0.85em 1.45em;
  padding: 0;
}

.vivi-profile-intro-description :where(li) {
  margin: 0.2em 0;
}

.vivi-profile-intro-description :where(h1, h2, h3, h4, h5, h6) {
  margin: 1em 0 0.45em;
  color: var(--vivi-color-heading);
  font-family: var(--vivi-font-heading);
  font-weight: var(--vivi-fw-bold);
  line-height: var(--vivi-lh-heading);
}

.vivi-profile-intro-description :where(h1, h2) {
  font-size: var(--vivi-fs-h3);
}

.vivi-profile-intro-description :where(h3, h4, h5, h6) {
  font-size: var(--vivi-fs-body-lg, var(--vivi-fs-body));
}

.vivi-profile-intro-description a {
  color: var(--vivi-color-primary);
  text-decoration: none;
}

.vivi-profile-intro-description a:hover {
  text-decoration: underline;
}

.vivi-profile-intro-info-grid {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--vivi-space-sm);
}

.vivi-profile-intro-info-item {
  padding: var(--vivi-space-md);
  border-radius: var(--vivi-radius, 8px);
  background: var(--vivi-color-bg-soft);
  border: 1px solid var(--vivi-color-border);
}

.vivi-profile-intro-info-item dt {
  margin: 0 0 var(--vivi-space-xs);
  color: var(--vivi-color-text-muted);
  font-size: var(--vivi-fs-small);
  font-weight: var(--vivi-fw-bold);
  line-height: var(--vivi-lh-compact);
}

.vivi-profile-intro-info-item dd {
  margin: 0;
  color: var(--vivi-color-heading);
  font-size: var(--vivi-fs-body);
  font-weight: var(--vivi-fw-regular);
  line-height: var(--vivi-lh-body);
  word-break: break-word;
}

.vivi-profile-social-links {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: var(--vivi-space-xs);
}

.vivi-profile-social-link,
.vivi-profile-intro-info-item dd .vivi-profile-social-link {
  display: inline-flex;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--vivi-color-border);
  border-radius: var(--vivi-radius, 8px);
  background: var(--vivi-color-card);
  color: var(--vivi-color-heading);
  line-height: 1;
  text-decoration: none;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.vivi-profile-social-link:hover,
.vivi-profile-social-link:focus-visible,
.vivi-profile-intro-info-item dd .vivi-profile-social-link:hover,
.vivi-profile-intro-info-item dd .vivi-profile-social-link:focus-visible {
  border-color: var(--vivi-color-accent);
  background: var(--vivi-color-accent-soft, rgba(166, 104, 7, 0.08));
  color: var(--vivi-color-accent);
  outline: none;
  text-decoration: none;
  transform: translateY(-1px);
}

.vivi-profile-social-link .vivi-bb-icon,
.vivi-profile-social-link .vivi-bb-icon::before {
  width: 24px;
  height: 24px;
  margin: 0;
  font-size: 24px;
  line-height: 24px;
}

.vivi-profile-intro-info-item a,
.vivi-profile-intro-info-item dd a {
  color: var(--vivi-color-primary);
  text-decoration: none;
}

.vivi-profile-intro-info-item a:hover,
.vivi-profile-intro-info-item dd a:hover {
  text-decoration: underline;
}

.vivi-profile-intro-empty {
  color: var(--vivi-color-text-muted) !important;
}


.vivi-profile-intro-panel { width:100%; margin:0 !important; padding:0 !important; gap:var(--vivi-space-md,16px) !important; box-sizing:border-box; }
.vivi-profile-intro-card { border-radius:0 !important; }



/* Existing brand detail helpers are canonical data/view fragments; normalize their geometry here. */
.vivi-profile-canonical .vivi-profile-brand-hero-details { display:flex; flex-direction:column; gap:10px; width:100%; min-width:0; margin-top:8px; }
.vivi-profile-canonical .vivi-profile-brand-taxonomy { width:100%; min-width:0; }
.vivi-profile-canonical .vivi-profile-brand-contact-list { display:grid; gap:6px; width:100%; }
.vivi-profile-canonical .vivi-profile-brand-contact-line { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:8px; align-items:start; min-width:0; text-decoration:none; color:inherit; }
.vivi-profile-canonical .vivi-profile-brand-contact-label { font-weight:700; color:var(--vivi-color-heading,#111); }
.vivi-profile-canonical .vivi-profile-brand-contact-value { min-width:0; color:var(--vivi-color-text,#555); overflow-wrap:anywhere; }


/* Canonical Hero badges. These used to live in vivi-groups.css; Profile now owns them. */
.vivi-profile-brand-discount {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  width:100%;
  box-sizing:border-box;
  line-height:1;
  text-align:center;
}
.vivi-profile-brand-discount {
  min-height:54px;
  padding:7px 5px 8px;
  border:1px solid color-mix(in srgb,var(--vivi-color-primary,#996515) 82%,#000);
  border-radius:10px;
  background:var(--vivi-color-primary,#996515);
  color:#fff;
  box-shadow:0 6px 14px color-mix(in srgb,var(--vivi-color-primary,#996515) 28%,transparent);
}
.vivi-profile-brand-discount-label {
  display:block;
  font-size:10px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
}
.vivi-profile-brand-discount-label { letter-spacing:.06em; }
.vivi-profile-brand-discount-value {
  display:block;
  font-size:19px;
  font-weight:900;
  line-height:1.05;
  white-space:nowrap;
}

/* v0.13.61：Profile／生活探索內層共用贈品資訊卡。資訊 icon 原地展開，不建立巢狀 Popup。 */
.vivi-family-gift-public-card{
  position:relative;
  display:grid;
  gap:var(--vivi-space-md,16px);
  min-width:0;
  overflow:visible;
}
.vivi-family-gift-public-card .vivi-family-gift-public-heading{
  margin-bottom:0;
  padding-right:42px;
}
.vivi-family-gift-public-overview{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  align-items:center;
  gap:var(--vivi-space-md,16px);
  min-width:0;
}
.vivi-family-gift-public-media{
  width:88px;
  aspect-ratio:1/1;
  border:1px solid var(--vivi-color-border);
  border-radius:var(--vivi-radius,8px);
  background:var(--vivi-color-bg-soft,#f2f4f5);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.vivi-family-gift-public-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.vivi-family-gift-public-media.is-empty i{
  font-size:30px;
  line-height:1;
  color:var(--vivi-color-muted,#667085);
}
.vivi-family-gift-public-main{
  min-width:0;
  display:grid;
  gap:6px;
}
.vivi-family-gift-public-name{
  color:var(--vivi-color-heading,#111827);
  font-family:var(--vivi-font-heading,var(--vivi-font-body,inherit));
  font-size:var(--vivi-fs-body,15px);
  font-weight:var(--vivi-fw-bold,700);
  line-height:var(--vivi-lh-heading,1.35);
  overflow-wrap:anywhere;
}
.vivi-family-gift-public-summary{
  color:var(--vivi-color-text,#344054);
  font-size:var(--vivi-fs-small,13px);
  line-height:var(--vivi-lh-body,1.6);
}
.vivi-family-gift-public-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 12px;
  color:var(--vivi-color-muted,#667085);
  font-size:var(--vivi-fs-xs,12px);
  line-height:1.45;
}
.vivi-family-gift-public-stock{
  color:var(--vivi-status-success,#067647);
  font-weight:var(--vivi-fw-bold,700);
}
.vivi-family-gift-public-stock.is-empty{
  color:var(--vivi-status-error,#b42318);
}
.vivi-family-gift-public-details{
  width:100%;
  min-width:0;
}
.vivi-family-gift-public-info{
  position:absolute;
  top:clamp(var(--vivi-space-lg,16px),3vw,var(--vivi-space-xl,24px));
  right:clamp(var(--vivi-space-lg,16px),3vw,var(--vivi-space-xl,24px));
  width:32px;
  height:32px;
  padding:0;
  border:1px solid var(--vivi-color-border);
  border-radius:var(--vivi-radius,8px);
  background:var(--vivi-color-card,#fff);
  color:var(--vivi-color-heading,#111827);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  list-style:none;
  transition:border-color .18s ease,background-color .18s ease,color .18s ease;
}
.vivi-family-gift-public-info::-webkit-details-marker{display:none;}
.vivi-family-gift-public-info::marker{display:none;content:"";}
.vivi-family-gift-public-info i{
  font-size:18px;
  line-height:1;
}
.vivi-family-gift-public-info:hover,
.vivi-family-gift-public-info:focus-visible,
.vivi-family-gift-public-details[open] .vivi-family-gift-public-info{
  border-color:var(--vivi-color-accent,var(--vivi-color-primary,#996515));
  background:var(--vivi-color-accent-soft,rgba(153,101,21,.08));
  color:var(--vivi-color-accent,var(--vivi-color-primary,#996515));
  outline:none;
}
.vivi-family-gift-public-info:focus-visible{
  box-shadow:0 0 0 3px color-mix(in srgb,var(--vivi-color-accent,var(--vivi-color-primary,#996515)) 18%,transparent);
}
.vivi-family-gift-public-detail-body{
  display:grid;
  gap:var(--vivi-space-md,16px);
  margin-top:var(--vivi-space-md,16px);
  padding-top:var(--vivi-space-md,16px);
  border-top:1px solid var(--vivi-color-border);
}
.vivi-family-gift-public-detail-item{
  display:grid;
  gap:6px;
}
.vivi-family-gift-public-detail-item>strong{
  color:var(--vivi-color-heading,#111827);
  font-size:var(--vivi-fs-small,13px);
  font-weight:var(--vivi-fw-bold,700);
  line-height:1.4;
}
.vivi-family-gift-public-detail-item p,
.vivi-family-gift-public-detail-text,
.vivi-family-gift-public-detail-text p{
  margin:0;
  color:var(--vivi-color-text,#344054);
  font-size:var(--vivi-fs-small,13px);
  line-height:var(--vivi-lh-body,1.65);
  white-space:normal;
  overflow-wrap:anywhere;
}
.vivi-family-gift-public-detail-text p+p{
  margin-top:6px;
}


/* 0.13.64：Profile 優惠摘要；94小確幸 Tab 不顯示數量。 */
.vivi-profile-brand-offer-summary{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-top:8px;
}
.vivi-profile-brand-offer-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:23px;
  padding:4px 8px;
  border:1px solid color-mix(in srgb,var(--vivi-color-primary,#996515) 28%,transparent);
  border-radius:var(--vivi-radius,8px);
  background:color-mix(in srgb,var(--vivi-color-primary,#996515) 8%,#fff);
  color:var(--vivi-color-primary,#996515);
  font-size:11px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
}



/* Canonical Profile more-menu actions (moved from Groups in 0.13.190). */
.vivi-profile-actions-list {
  display:grid;
  grid-template-columns:1fr;
  gap:var(--vivi-space-xs,8px);
  width:100%;
}
.vivi-profile-actions-item.vivi-page-tab {
  justify-content:flex-start;
  width:100%;
  min-width:0;
  height:48px;
  min-height:48px;
  max-height:none;
  padding:0 16px;
  border-color:var(--vivi-color-border);
  background:var(--vivi-color-card);
  text-align:left;
  box-sizing:border-box;
}
.vivi-profile-actions-item.vivi-page-tab:hover {
  border-color:color-mix(in srgb,var(--vivi-color-orange) 32%,var(--vivi-color-border));
}


/* Canonical Profile public business-hours presentation. Admin/editor layout stays in vivi-brand-hours.css. */
.vivi-brand-hours-public-card {
  gap: 18px;
}

.vivi-brand-hours-current {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--vivi-color-border, #ddd);
  border-radius: var(--vivi-radius, 8px) var(--vivi-radius, 8px) 0 0;
  background: var(--vivi-color-bg-soft, #f7f4ee);
}

.vivi-brand-hours-status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #ececec;
  color: #333;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.vivi-brand-hours-status.is-open,
.vivi-brand-hours-status.is-closing-soon {
  border-color: color-mix(in srgb, var(--vivi-business-status-green, #2f855a) 30%, #fff);
  background: var(--vivi-business-status-green-soft, #e8f7ed);
  color: var(--vivi-business-status-green-text, #176b35);
}

.vivi-brand-hours-status.is-opening-soon,
.vivi-brand-hours-status.is-opens-later,
.vivi-brand-hours-status.is-break {
  border-color: color-mix(in srgb, var(--vivi-business-status-yellow, #ffd43b) 72%, #806800);
  background: var(--vivi-business-status-yellow-soft, #fff5b8);
  color: var(--vivi-business-status-yellow-text, #5f4a00);
}

.vivi-brand-hours-status.is-closed-today,
.vivi-brand-hours-status.is-closed-finished {
  border-color: color-mix(in srgb, var(--vivi-business-status-red, #c43d3d) 30%, #fff);
  background: var(--vivi-business-status-red-soft, #fdeaea);
  color: var(--vivi-business-status-red-text, #9f2d2d);
}

.vivi-brand-hours-status.is-unavailable {
  border-color: var(--vivi-color-border, #d6d9dd);
  background: var(--vivi-business-status-unavailable, #fff);
  color: var(--vivi-business-status-unavailable-text, #6b7280);
}

.vivi-brand-hours-current-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.vivi-brand-hours-current-copy strong {
  color: var(--vivi-color-heading, #111);
  font-size: 15px;
  line-height: 1.45;
}

.vivi-brand-hours-current-copy span {
  color: var(--vivi-color-text-muted, #666);
  font-size: 13px;
  line-height: 1.5;
}

.vivi-brand-hours-weekly {
  overflow: hidden;
  margin-top: -1px;
  border: 1px solid var(--vivi-color-border, #ddd);
  border-radius: 0 0 var(--vivi-radius, 8px) var(--vivi-radius, 8px);
  background: #fff;
}

.vivi-brand-hours-weekly summary {
  padding: 13px 16px;
  cursor: pointer;
  color: var(--vivi-color-heading, #111);
  font-size: 14px;
  font-weight: 700;
}

.vivi-brand-hours-week-list {
  display: grid;
  border-top: 1px solid var(--vivi-color-border, #eee);
}

.vivi-brand-hours-week-row {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 16px;
  padding: 13px 16px;
  border-top: 1px solid var(--vivi-color-border, #eee);
}

.vivi-brand-hours-week-row:first-child {
  border-top: 0;
}

.vivi-brand-hours-week-row.is-today {
  background: var(--vivi-color-bg-soft, #f7f4ee);
}

.vivi-brand-hours-week-day {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--vivi-color-heading, #111);
  font-size: 14px;
  font-weight: 700;
}

.vivi-brand-hours-week-day span {
  display: inline-flex;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--vivi-color-heading, #111);
  color: #fff;
  font-size: 10px;
  line-height: 1.35;
}

.vivi-brand-hours-week-periods {
  display: grid;
  gap: 8px;
}

.vivi-brand-hours-week-period {
  display: grid;
  gap: 2px;
}

.vivi-brand-hours-week-period strong,
.vivi-brand-hours-closed {
  color: var(--vivi-color-text, #333);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}

.vivi-brand-hours-week-period span {
  color: var(--vivi-color-text-muted, #666);
  font-size: 12px;
  line-height: 1.5;
}

.vivi-brand-hours-closed {
  color: var(--vivi-color-text-muted, #777);
}

/* Canonical Profile intro business-hours panels remain square. */
.vivi-profile-canonical .vivi-brand-hours-current,
.vivi-profile-canonical .vivi-brand-hours-weekly {
  border-radius:0 !important;
}

/* Canonical Profile-only utility popups. */
.vivi-profile-canonical .vivi-profile-activity-filter-options {
  display:grid;
  grid-template-columns:1fr;
  gap:var(--vivi-space-xs,8px);
  width:100%;
}
.vivi-profile-canonical .vivi-profile-activity-filter-option.vivi-page-tab {
  justify-content:flex-start;
  width:100%;
  min-width:0;
  height:48px;
  min-height:48px;
  max-height:none;
  padding:0 16px;
  border-color:var(--vivi-color-border);
  background:var(--vivi-color-card);
  text-align:left;
  box-sizing:border-box;
}
.vivi-profile-canonical .vivi-profile-activity-filter-option.vivi-page-tab.is-active {
  border-color:var(--vivi-page-tab-active-border);
  background:var(--vivi-page-tab-active-bg);
  color:var(--vivi-page-tab-active-color);
}

.vivi-profile-media-action:hover,
.vivi-profile-media-action:focus-visible,
.vivi-profile-avatar-edit-link:hover .vivi-profile-avatar-edit-icon,
.vivi-profile-avatar-edit-link:focus-visible .vivi-profile-avatar-edit-icon {
  border-color:color-mix(in srgb,var(--vivi-color-primary,#996515) 42%,var(--vivi-color-border,#dedede)) !important;
  color:var(--vivi-color-primary,#996515) !important;
}

@container vivi-profile (max-width: 767px) {
  /* Intro and public business hours follow the Profile container, not browser viewport. */
  .vivi-profile-intro-panel { margin-top:0; gap:var(--vivi-space-md); }
  .vivi-profile-intro-card { padding:var(--vivi-space-lg); border-radius:var(--vivi-radius,8px); }
  .vivi-profile-intro-card-heading { align-items:flex-start; }
  .vivi-profile-intro-edit-link { min-height:36px; padding:6px 10px; }
  .vivi-profile-intro-info-grid { grid-template-columns:1fr; }
  .vivi-profile-canonical .vivi-brand-hours-current { align-items:flex-start; flex-direction:column; }
  .vivi-profile-canonical .vivi-brand-hours-week-row { grid-template-columns:88px minmax(0,1fr); gap:10px; padding:12px; }
  .vivi-family-gift-public-overview { grid-template-columns:72px minmax(0,1fr); gap:var(--vivi-space-sm,12px); }
  .vivi-family-gift-public-media { width:72px; }
  .vivi-family-gift-public-card .vivi-family-gift-public-heading { padding-right:38px; }
  .vivi-family-gift-public-info { width:30px; height:30px; }
  .vivi-profile-hero-body { grid-template-columns:64px minmax(0,1fr); gap:16px; padding:16px; }
  .vivi-profile-hero-avatar-column { width:64px; min-width:64px; gap:6px; }
  .vivi-profile-avatar { width:64px; height:64px; }
  .vivi-profile-hero-top { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
  .vivi-profile-hero-titleblock h1 { margin-bottom:6px; font-size:var(--vivi-fs-h3,20px); }
  .vivi-profile-hero-actions.vivi-loop-action-icons { justify-self:end !important; width:auto !important; max-width:none !important; }
  .vivi-profile-cover-media-actions { top:12px !important; right:12px !important; gap:8px !important; }
  .vivi-profile-media-action { width:34px !important; height:34px !important; min-width:34px !important; }
  .vivi-profile-cover-position,
  [data-vivi-profile-cover-reposition],
  .vivi-profile-cover-reposition-bar { display:none !important; }
  .vivi-profile-tabs.vivi-profile-page-nav { margin-top:0 !important; }
  .vivi-profile-tabs > .vivi-profile-tab.vivi-page-tab { min-height:54px !important; padding-inline:6px !important; font-size:14px !important; }
  .vivi-profile-tabs > .vivi-profile-tab.is-active { min-height:42px !important; margin:6px !important; }
  .vivi-profile-list-panel { margin-top:0; }
  .vivi-profile-list-panel__body { padding:14px; }
  .vivi-profile-commerce-grid,
  .vivi-profile-deals-grid,
  .vivi-profile-ticket-content .vivi-ticket-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
  .vivi-profile-reward-rule-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .vivi-profile-reward-rule { min-height:76px; padding:12px; }

  /* Canonical Profile Activity follows the Profile container, not the browser viewport. */
  .vivi-profile-canonical-activity .vivi-feed-post.vivi-life-journal-post {
    grid-template-columns:42px minmax(0,1fr);
    column-gap:10px;
    padding:16px 16px 13px;
    border-right:0!important;
    border-left:0!important;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-publisher {
    grid-template-columns:42px minmax(0,1fr) 32px;
    gap:10px;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-avatar {
    width:42px;
    height:42px;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-publisher-copy { min-height:32px; }
  .vivi-profile-canonical-activity .vivi-life-journal-author { font-size:15.5px; }
  .vivi-profile-canonical-activity .vivi-life-journal-meta { font-size:14.5px; }
  .vivi-profile-canonical-activity .vivi-life-journal-title {
    font-size:16px!important;
    line-height:1.45!important;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-content,
  .vivi-profile-canonical-activity .vivi-life-journal-content .vivi-feed-post-text-content {
    font-size:16px;
    line-height:1.52;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-content[data-vivi-feed-collapse-pending="1"][data-vivi-feed-lines="5"] .vivi-feed-post-text-content {
    max-height:7.6em;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-video,
  .vivi-profile-canonical-activity .vivi-life-journal-video .vivi-activity-youtube,
  .vivi-profile-canonical-activity .vivi-life-journal-video .vivi-feed-youtube {
    border-radius:12px!important;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-media { --vivi-journal-media-gap:7px; }
  .vivi-profile-canonical-activity .vivi-life-journal-media.is-single .vivi-life-journal-media-item,
  .vivi-profile-canonical-activity .vivi-life-journal-media.is-carousel .vivi-life-journal-media-item {
    border-radius:12px;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-post .vivi-life-journal-media,
  .vivi-profile-canonical-activity .vivi-life-journal-post .vivi-life-journal-video,
  .vivi-profile-canonical-activity .vivi-life-journal-media-shell {
    margin-top:14px!important;
  }
  .vivi-profile-canonical-activity .vivi-life-journal-media-shell>.vivi-life-journal-media { margin-top:0!important; }
  .vivi-profile-canonical-activity .vivi-life-journal-media-shell>.vivi-life-journal-carousel-nav {
    display:none!important;
  }

  /* Commerce Cards follow the Profile container, not the browser viewport. */
  .vivi-profile-canonical .vivi-commerce-card__body { padding:var(--vivi-space-xs,8px)!important; }
  .vivi-profile-canonical .vivi-commerce-card__title,
  .vivi-profile-canonical .vivi-commerce-card__title a,
  .vivi-profile-canonical .vivi-ticket-title-link { font-size:var(--vivi-fs-xs,12px)!important; }
  .vivi-profile-canonical .vivi-commerce-card__primary { font-size:var(--vivi-fs-xs,12px)!important; }
  .vivi-profile-canonical .vivi-commerce-card__saving { left:8px!important; top:8px!important; max-width:calc(100% - 16px)!important; padding:3px 7px!important; font-size:11px!important; }
  .vivi-profile-canonical .vivi-commerce-card__kind { left:8px!important; top:8px!important; padding:3px 7px!important; font-size:11px!important; }
  .vivi-profile-canonical .vivi-commerce-card__status { min-height:20px!important; padding:3px 6px!important; font-size:11px!important; }
  .vivi-profile-canonical .vivi-commerce-card__brand-overlay { right:8px!important; bottom:8px!important; padding:3px 7px!important; font-size:11px!important; }

  .vivi-profile-brand-discount { min-height:48px; padding:6px 4px 7px; border-radius:9px; }
  .vivi-profile-brand-discount-label { font-size:9px; }
  .vivi-profile-brand-discount-value { font-size:17px; }
}