@charset "UTF-8";
/*
 * Honey Rose / Pink & Gold — 2026-10-02 / v12
 * 對應本次提供的現有 HTML。請放在 bootstrap / slicknav / main.css 後面。
 * 這是附加主題：保留原 CSS、HTML 結構、JS、輪播和表單顯示狀態。
 * 低亮度紫粉底色、活潑莓粉與細金線；調色入口在 :root。
 * 純 CSS，不需新增 JS 或任何外部字型；包含 v2/v3 全站排版與低亮度修正。
 */

:root {
  --hr-paper: #291f2d;
  --hr-surface: #332339;
  --hr-blush: #51304b;
  --hr-petal: #a66089;
  --hr-rose: #e997c3;
  --hr-rose-deep: #f2b4d9;
  --hr-ink: #f3deed;
  --hr-muted: #ccb2c9;
  --hr-line: #5c3d59;
  --hr-gold: #d6b268;
  --hr-radius: 22px;
  --hr-shadow: 0 10px 36px rgba(12, 8, 12, .065);
  --hr-shadow-hover: 0 20px 42px rgba(12, 8, 12, .14);
  --hr-ease: cubic-bezier(.22, .61, .36, 1);
}

html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body {
  color: var(--hr-ink) !important;
  background-color: var(--hr-paper) !important;
  background-image:
    radial-gradient(ellipse at 0 0, rgba(168, 75, 132, .16), transparent 46%),
    radial-gradient(ellipse at 100% 25%, rgba(174, 142, 67, .08), transparent 38%) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: rgba(211, 151, 178, .12);
}
::selection { background: #a66089; color: #f3deed; }

/* 導覽：保留手機 slicknav 的展開/收合，以及原本定位方式。 */
#header {
  color: var(--hr-ink) !important;
  background: rgba(44, 30, 48, .98) !important;
  border-bottom: 1px solid rgba(185, 137, 88, .19);
  box-shadow: 0 5px 24px rgba(12, 8, 12, .055);
}
#header .head-main { box-sizing: border-box; background: transparent !important; }
#header .logo img { max-width: 100%; height: auto; }
#header .logo a { display: inline-block; transition: filter .35s ease; }
#header .logo a:hover { filter: drop-shadow(0 4px 7px rgba(211, 151, 178, .16)); }
#header .head-tool { margin-bottom: 16px; }
#header .head-tool a.member {
  display: inline-block;
  padding: 8px 17px !important;
  color: var(--hr-rose-deep) !important;
  background: #332339 !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 9px rgba(12, 8, 12, .035);
  text-decoration: none;
  transition: background-color .25s, box-shadow .25s, transform .25s;
}
#header .head-tool a.member:hover {
  background: var(--hr-blush) !important;
  box-shadow: 0 5px 14px rgba(12, 8, 12, .09);
  transform: translateY(-2px);
}
#nav.b-color {
  box-sizing: border-box; max-width: 100%;
  background: linear-gradient(115deg, #6e3b63, #542e58 58%, #734164) !important;
  border: 1px solid rgba(229, 203, 217, .08);
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(229, 203, 217, .08), 0 8px 22px rgba(12, 8, 12, .12);
}
#menu > li > a {
  position: relative;
  color: #f3e5ed !important;
  background: transparent !important;
  border-color: rgba(255, 255, 255, .13) !important;
  letter-spacing: .045em;
  text-decoration: none;
  transition: background-color .25s ease;
}
#menu > li > a::after {
  content: "";
  position: absolute;
  right: 22%; left: 22%; bottom: 9px;
  height: 2px;
  border-radius: 2px;
  background: #d6bda6;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .35s var(--hr-ease);
  pointer-events: none;
}
#menu > li > a:hover, #menu > li > a:focus-visible { background: rgba(255, 255, 255, .1) !important; }
#menu > li > a:hover::after, #menu > li > a:focus-visible::after,
#menu > li.current > a::after, #menu > li > a.current::after { transform: scaleX(1); }
#menu .home_w { width: 23px; height: auto; opacity: .9; }
.slicknav_menu { background: #291f2d !important; }
.slicknav_btn {
  background: #78305c !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(12, 8, 12, .11);
}
.slicknav_nav { background: #291f2d !important; border-radius: 16px; }
.slicknav_nav a { color: var(--hr-rose-deep) !important; border-radius: 10px !important; }
.slicknav_nav a:hover, .slicknav_nav .slicknav_row:hover { background: var(--hr-blush) !important; color: var(--hr-rose-deep) !important; }

/* 只處理正常頁首橫幅；頁尾同名的固定提示列不套用這些尺寸/裝飾。 */
body > .inside-banner:not([style]) {
  position: relative;
  isolation: isolate;
  min-height: 158px;
  padding: 30px 20px;
  color: var(--hr-ink) !important;
  background: linear-gradient(120deg, #483048, #332439 51%, #46333f) !important;
  border-bottom: 1px solid var(--hr-line);
  overflow: hidden;
}
body > .inside-banner:not([style])::before,
body > .inside-banner:not([style])::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 360px; height: 240px;
  border: 1px solid rgba(185, 137, 88, .25);
  border-radius: 50%;
  transform: rotate(-22deg);
  pointer-events: none;
}
body > .inside-banner:not([style])::before { left: -110px; top: -165px; box-shadow: 0 0 0 22px rgba(229, 203, 217, .025); }
body > .inside-banner:not([style])::after { right: -110px; bottom: -175px; box-shadow: 0 0 0 25px rgba(229, 203, 217, .025); }
.inside-banner .banner-title { position: relative; color: var(--hr-ink) !important; text-align: center; }
.banner-title strong { color: var(--hr-ink) !important; font-size: clamp(24px, 3vw, 36px); font-weight: 600; letter-spacing: .1em; }
.banner-title em { color: var(--hr-muted) !important; font-size: 13px; font-style: normal; letter-spacing: .18em; }
.banner-title .glyphicon { color: var(--hr-rose) !important; opacity: .8; }
.banner-bg { background: transparent !important; }

/* 留白與閱讀面板。不要對所有 div/圖片/標題做全域重設。 */
.wrapper { box-sizing: border-box; background: transparent !important; }
.wrapper > .main { box-sizing: border-box; width: 100% !important; color: var(--hr-ink) !important; background: transparent !important; padding-top: 28px; padding-bottom: 42px; }
.content-body { color: var(--hr-ink) !important; background: transparent !important; }
.content-body a, .member-login-box a { color: var(--hr-rose-deep); }
.page-title {
  color: var(--hr-ink) !important;
  background: transparent !important;
  border-color: var(--hr-line) !important;
  padding-bottom: 15px !important;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .035em;
}
.page-main, .member-login-box {
  color: var(--hr-ink) !important;
  background: var(--hr-surface) !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: var(--hr-radius) !important;
  box-shadow: var(--hr-shadow);
  padding: clamp(20px, 3vw, 38px) !important;
  overflow-wrap: anywhere;
}
.page-main { line-height: 1.85; }
.page-main img { max-width: 100%; height: auto; border-radius: 12px; }
.page-main p { margin-bottom: 1.15em; }
.news-detail .time { color: var(--hr-muted) !important; font-size: 13px; margin: 0 0 18px; letter-spacing: .035em; }
.contact-note {
  color: var(--hr-rose-deep) !important;
  background: #503149 !important;
  border: 1px solid #774462 !important;
  border-radius: 14px;
  padding: 13px 18px !important;
  margin-bottom: 24px;
  line-height: 1.75;
}
.contact-note a { color: #f2b4d9 !important; text-decoration: underline; text-underline-offset: 3px; }

/* 現有側欄與分類連結，保留原有的 class/current 狀態。 */
.classBox { background: #332339 !important; border: 1px solid var(--hr-line) !important; border-radius: 18px; padding: 10px !important; box-shadow: var(--hr-shadow); }
.classBox .classLink { margin: 0 !important; padding: 0 !important; list-style: none; }
.classBox .classLink > li { border-color: #503f4b !important; }
.classBox .classLink > li > a {
  display: block;
  padding: 13px 15px !important;
  color: var(--hr-muted) !important;
  background: transparent !important;
  border-radius: 11px;
  line-height: 1.65;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: background-color .25s, color .25s, box-shadow .25s;
}
.classBox .classLink > li > a:hover { color: var(--hr-rose-deep) !important; background: var(--hr-blush) !important; }
.classBox .classLink > li > a.current,
.classBox .classLink > li.current > a {
  color: var(--hr-rose-deep) !important;
  background: linear-gradient(115deg, #69395c, #493046) !important;
  box-shadow: inset 3px 0 0 var(--hr-rose);
  font-weight: 600;
}

/* 卡片：使用既有 ul/li，圖片只在既有卡片範圍內縮放。 */
.i-pro { background: transparent !important; }
.i-pro > .title { color: var(--hr-ink) !important; background: transparent !important; padding: 16px 0; }
.i-pro > .title::after { content: ""; display: block; width: 42px; height: 2px; background: var(--hr-gold); margin: 18px auto 0; }
.i-pro-main { color: var(--hr-ink) !important; background: transparent !important; }
.i-pro-main h3 { color: var(--hr-rose-deep) !important; letter-spacing: .055em; }
.i-pro-list > ul, .pro-list > ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0 !important; padding: 0 !important;
  list-style: none;
}
.i-pro-list > ul::before, .i-pro-list > ul::after,
.pro-list > ul::before, .pro-list > ul::after { display: none !important; }
.i-pro-list > ul > li, .pro-list > ul > li {
  position: relative;
  width: auto !important; min-width: 0; height: auto !important;
  box-sizing: border-box;
  float: none !important;
  margin: 0 !important; padding: 10px 10px 18px !important;
  color: var(--hr-ink) !important;
  background: #332339 !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: var(--hr-radius) !important;
  box-shadow: var(--hr-shadow);
  transition: transform .4s var(--hr-ease), box-shadow .4s ease, border-color .4s ease;
}
.i-pro-list .pro-photo, .pro-list .pro-photo {
  position: relative;
  width: 100% !important; height: auto !important;
  float: none !important;
  margin: 0 !important;
  border-radius: 15px;
  overflow: hidden;
  background: var(--hr-blush);
}
.i-pro-list .pro-photo > a, .pro-list .pro-photo > a { display: block; }
.i-pro-list .pro-photo .index-pro-img, .pro-list .pro-photo .index-pro-img {
  display: block;
  width: 100% !important; height: auto !important;
  margin: 0 !important;
  transition: transform .65s var(--hr-ease);
}
.i-pro-list .pro-photo::after, .pro-list .pro-photo::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(110deg, transparent 25%, rgba(229, 203, 217, .08) 48%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .85s var(--hr-ease);
  pointer-events: none;
}
.i-pro-list > ul > li > h4, .pro-list > ul > li > h4 {
  color: var(--hr-ink) !important;
  margin: 17px 8px 6px !important;
  font-size: 19px; font-weight: 600; line-height: 1.5; letter-spacing: .04em;
}
.i-pro-list > ul > li > h4 a, .pro-list > ul > li > h4 a { color: inherit !important; }
.pro-list .index-pro-price { display: inline-block; color: var(--hr-rose-deep) !important; margin: 0 8px; font-size: 14px; letter-spacing: .02em; }
.more > a {
  display: inline-block;
  padding: 9px 24px !important;
  color: var(--hr-rose-deep) !important;
  background: #332339 !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: 999px;
  transition: background-color .3s, box-shadow .3s;
}
.more > a:hover { background: var(--hr-blush) !important; box-shadow: 0 5px 15px rgba(12, 8, 12, .09); }

/* 表單：只改外觀，不強制 form/input 的 display，不碰 hidden 與 JS。 */
.member-login-box { max-width: 620px; margin: 0 auto 30px !important; }
.form-box { background: transparent !important; }
.opinion { border-color: var(--hr-line) !important; }
.input-main-style02, .member-login-box #logintype,
.wrapper .form-box input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.wrapper .form-box textarea, .wrapper .form-box select, .page select {
  box-sizing: border-box;
  max-width: 100%; min-height: 46px;
  padding: 11px 14px !important;
  color: var(--hr-ink) !important;
  background-color: #2d2233 !important;
  border: 1px solid #865578 !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 2px rgba(12, 8, 12, .025);
  font-size: 16px; line-height: 1.4;
  transition: border-color .25s, background-color .25s, box-shadow .25s;
}
.member-login-box #logintype { margin-bottom: 20px; }
.input-main-style02::placeholder, .form-box input::placeholder, .form-box textarea::placeholder { color: #bfa6be; opacity: 1; }
.input-main-style02:focus, .member-login-box #logintype:focus,
.form-box input:focus, .form-box textarea:focus, .form-box select:focus, .page select:focus {
  background-color: #3a2840 !important;
  border-color: var(--hr-rose) !important;
  box-shadow: 0 0 0 4px rgba(211, 151, 178, .11);
}
.cart-btn .btn-ok {
  position: relative;
  box-sizing: border-box; max-width: 100%; min-height: 46px;
  padding: 12px 25px !important;
  color: #f3e5ed !important;
  background: linear-gradient(120deg, #9a417b, #78305c) !important;
  border: 1px solid rgba(12, 8, 12, .18) !important;
  border-radius: 13px !important;
  box-shadow: 0 6px 17px rgba(12, 8, 12, .14), inset 0 1px 0 rgba(229, 203, 217, .09);
  font-weight: 600; line-height: 1.5;
  text-decoration: none;
  transition: box-shadow .3s, transform .3s;
}
/* 保留 LINE 按鈕辨識度，避免和一般登入混淆。 */
.cart-btn .btn-ok[href*="line.me"], .cart-btn .btn-ok[href*="line_login"] { background: linear-gradient(120deg, #266a4d, #20543e) !important; border-color: #20543e !important; }
.cart-btn .btn-ok:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(12, 8, 12, .22); }
.cart-btn .btn-ok:active { transform: translateY(0); }
.cart-btn .btn-ok[aria-disabled="true"], .cart-btn .btn-ok:disabled { opacity: .55; box-shadow: none; transform: none; }

/* 會員資料列保留欄位順序與原本寬度，只改色彩及表面。 */
.order-list { color: var(--hr-ink) !important; }
ul.order-list.ul_table {
  background: #332339 !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: 16px;
  box-shadow: var(--hr-shadow);
}
.order-list.ul_table > li { background: #332339 !important; border-color: #503f4b !important; transition: background-color .25s; }
.order-list.ul_table > li.th { color: var(--hr-rose-deep) !important; background: #58344e !important; border-radius: 15px 15px 0 0; }
.order-list-th { color: var(--hr-rose-deep) !important; background: transparent !important; font-weight: 600; }
.order-list-td { color: var(--hr-ink) !important; background: transparent !important; border-color: #503f4b !important; overflow-wrap: anywhere; }
.order-list.ul_table > li:not(.th):hover { background: #41323e !important; }
.order-list .price { color: var(--hr-rose-deep) !important; }
.order-list .numb { font-variant-numeric: tabular-nums; }
.order-numb { color: var(--hr-ink) !important; }
.page { margin-top: 28px; }
.page a {
  display: inline-block;
  padding: 8px 16px !important;
  color: var(--hr-rose-deep) !important;
  background: #332339 !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: 11px;
  text-decoration: none;
  transition: background-color .25s;
}
.page a:hover, .page a.current { background: var(--hr-blush) !important; }

/* 頁尾、既有回頂按鈕，以及固定底部提示列。 */
#footer {
  color: var(--hr-muted) !important;
  background: linear-gradient(125deg, #322831, #382c35 65%, #3b3034) !important;
  border-top: 1px solid var(--hr-line);
}
#footer .footer { color: var(--hr-muted) !important; background: transparent !important; padding-top: 30px; padding-bottom: 78px; }
#footer a { color: var(--hr-rose-deep) !important; text-underline-offset: 4px; }
#top.top2 {
  color: #f3e5ed !important;
  background: linear-gradient(140deg, #82495f, #583444) !important;
  border: 3px solid #332339 !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 24px rgba(12, 8, 12, .2);
  /* 不改 right/display/transform，保留原 JS 的進出場控制。 */
}
#top.top2:hover { background: #6d3d53 !important; box-shadow: 0 12px 28px rgba(12, 8, 12, .3); }
.inside-banner[style] {
  color: var(--hr-rose-deep) !important;
  background-color: #342a33 !important;
  border-top: 1px solid #654c5c;
  box-shadow: 0 -4px 18px rgba(12, 8, 12, .07);
  padding: 8px 12px;
  line-height: 1.6;
}
.inside-banner[style] button {
  color: var(--hr-rose-deep);
  background: #332339;
  border: 1px solid #865578;
  border-radius: 8px;
  padding: 5px 10px;
}
/* 年齡確認框只改外觀；保留原有顯示、遮罩與確認流程。 */
.ui-dialog { background: #2d2233 !important; border: 1px solid var(--hr-line) !important; border-radius: 18px !important; box-shadow: 0 22px 64px rgba(12, 8, 12, .24); }
.ui-dialog .ui-dialog-titlebar { color: var(--hr-rose-deep) !important; background: #58344e !important; border-color: var(--hr-line) !important; border-radius: 12px; }
.ui-dialog .ui-dialog-content { color: var(--hr-ink) !important; background: transparent !important; }
.ui-dialog .ui-dialog-buttonpane { background: transparent !important; border-color: var(--hr-line) !important; }

/* 清晰鍵盤焦點，不取消原有 outline。 */
#header a:focus-visible, .wrapper a:focus-visible, .wrapper input:focus-visible,
.wrapper select:focus-visible, .wrapper textarea:focus-visible, .slicknav_btn:focus-visible {
  outline: 2px solid var(--hr-rose) !important;
  outline-offset: 4px;
}

@media (min-width: 801px) {
  #header .head-main { max-width: 1200px; margin-left: auto; margin-right: auto; padding: 22px 24px 16px; }
  #nav { clear: both; }
  .wrapper { width: auto !important; max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px; }
  /* 只對明確包含側欄的頁面接管左右欄；其他內容頁不改欄位結構。 */
  @supports selector(:has(*)) {
    .content-body:has(> .side-bar) { display: grid !important; grid-template-columns: 212px minmax(0, 1fr); gap: 28px; align-items: start; }
    .content-body:has(> .side-bar)::before, .content-body:has(> .side-bar)::after { display: none !important; }
    .content-body:has(> .side-bar) > .side-bar,
    .content-body:has(> .side-bar) > .pro-list-main { width: auto !important; min-width: 0; float: none !important; margin: 0 !important; }
  }
}
@media (hover: hover) and (pointer: fine) {
  .i-pro-list > ul > li:hover, .pro-list > ul > li:hover {
    transform: translateY(-7px);
    border-color: #997086 !important;
    box-shadow: var(--hr-shadow-hover);
  }
  .i-pro-list > ul > li:hover .index-pro-img, .pro-list > ul > li:hover .index-pro-img { transform: scale(1.035); }
  .i-pro-list > ul > li:hover .pro-photo::after, .pro-list > ul > li:hover .pro-photo::after { transform: translateX(120%); }
}

/* 初次進場：短暫、一次，不覆蓋輪播 JS 的 transform。 */
@keyframes hr-arrive { from { opacity: .75; translate: 0 10px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: no-preference) {
  .banner-title, .wrapper .page-title { animation: hr-arrive .65s var(--hr-ease) both; }
  .i-pro-list > ul > li, .pro-list > ul > li { animation: hr-arrive .65s var(--hr-ease) both; }
  .i-pro-list > ul > li:nth-child(2), .pro-list > ul > li:nth-child(2) { animation-delay: .07s; }
  .i-pro-list > ul > li:nth-child(3), .pro-list > ul > li:nth-child(3) { animation-delay: .14s; }
  /* 支援 view timeline 的瀏覽器才啟用捲動浮現；不支援者保持可見。 */
  @supports (animation-timeline: view()) {
    @keyframes hr-scroll-arrive { from { opacity: .72; translate: 0 20px; } to { opacity: 1; translate: 0 0; } }
    .i-pro-list > ul > li, .pro-list > ul > li {
      animation: hr-scroll-arrive linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 90%;
      animation-delay: 0s;
    }
  }
}

@media (max-width: 1000px) and (min-width: 801px) {
  .i-pro-list > ul, .pro-list > ul { gap: 17px; }
  .pro-list > ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  @supports selector(:has(*)) { .content-body:has(> .side-bar) { grid-template-columns: 180px minmax(0, 1fr); gap: 20px; } }
}
@media (max-width: 800px) {
  #header .head-main { padding: 12px 14px; }
  #header .head-tool { margin-bottom: 8px; }
  #header .head-tool a.member { padding: 6px 11px !important; font-size: 13px; }
  #nav.b-color { border-radius: 13px; }
  .wrapper { box-sizing: border-box; width: 100% !important; max-width: 100%; padding-left: 14px !important; padding-right: 14px !important; }
  .wrapper > .main { width: 100% !important; box-sizing: border-box; padding-top: 20px; padding-bottom: 28px; }
  .content-body > .side-bar, .content-body > .pro-list-main { box-sizing: border-box; width: 100% !important; min-width: 0; float: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  .side-bar { margin-bottom: 20px !important; }
  .classBox .classLink { display: flex; flex-wrap: wrap; gap: 6px; }
  .classBox .classLink > li { float: none !important; width: auto !important; margin: 0 !important; border: 0 !important; }
  .classBox .classLink > li > a { padding: 10px 12px !important; font-size: 13px; }
  .i-pro-list > ul, .pro-list > ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
  .i-pro-list > ul > li, .pro-list > ul > li { padding: 7px 7px 14px !important; border-radius: 17px !important; }
  .i-pro-list .pro-photo, .pro-list .pro-photo { border-radius: 11px; }
  .i-pro-list > ul > li > h4, .pro-list > ul > li > h4 { font-size: 17px; margin: 12px 4px 4px !important; }
  .pro-list .index-pro-price { font-size: 13px; margin: 0 4px; }
  .page-main, .member-login-box { padding: 21px 17px !important; border-radius: 18px !important; }
  .contact-note { padding: 12px 14px !important; font-size: 14px; }
  body > .inside-banner:not([style]) { min-height: 128px; padding: 25px 16px; }
  .cart-btn .btn-ok { float: none !important; margin: 5px 4px 5px 0; }
  .member-login-box .cart-btn .btn-ok { display: block; width: 100% !important; margin: 9px 0 !important; text-align: center; }
  .order-list-th, .order-list-td { font-size: 13px; }
  #footer .footer { padding-left: 16px; padding-right: 16px; overflow-wrap: anywhere; }
  #top.top2 { width: 48px; height: 48px; font-size: 12px; bottom: 72px; }
  .inside-banner[style] { font-size: 12px; }
}
@media (max-width: 360px) {
  .i-pro-list > ul, .pro-list > ul { gap: 9px; }
  .i-pro-list > ul > li > h4, .pro-list > ul > li > h4 { font-size: 16px; }
  .wrapper { padding-left: 10px !important; padding-right: 10px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .banner-title, .wrapper .page-title,
  .i-pro-list > ul > li, .pro-list > ul > li { animation: none !important; translate: none !important; }
  #header a, #menu > li > a, #menu > li > a::after,
  .classBox .classLink > li > a, .cart-btn .btn-ok, .more > a,
  .i-pro-list > ul > li, .pro-list > ul > li,
  .i-pro-list .index-pro-img, .pro-list .index-pro-img,
  .i-pro-list .pro-photo::after, .pro-list .pro-photo::after { transition: none !important; }
  .i-pro-list > ul > li:hover, .pro-list > ul > li:hover,
  .i-pro-list > ul > li:hover .index-pro-img, .pro-list > ul > li:hover .index-pro-img { transform: none !important; }
  .i-pro-list .pro-photo::after, .pro-list .pro-photo::after { display: none; }
}

/* v2 修正：載入 v1 後可使用本補丁；完整 v2 已包含本段，兩者擇一。 */

/* 舊版灰底、黃線和箭頭需要同時清除。 */
.inside-banner:not([style]) .banner-title {
  margin: 0 auto !important;
  padding: 12px 16px !important;
  background: transparent !important;
  border: 0 !important;
  text-shadow: none !important;
  line-height: 1.5 !important;
}
.inside-banner:not([style]) .banner-title::after { display: none !important; }
.inside-banner:not([style]) .banner-title strong {
  display: inline-block;
  font-size: clamp(24px, 3vw, 36px) !important;
  font-weight: 600 !important;
  line-height: 1.5;
}
.inside-banner:not([style]) .banner-title em {
  display: block !important;
  margin-top: 7px;
  font: normal 13px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: .18em;
}

/* 原頁面少了結尾標籤時，固定列可能在 wrapper 內；直接指定視窗左右邊。 */
.inside-banner[style] {
  box-sizing: border-box;
  left: 0 !important; right: 0 !important;
  width: auto !important; max-width: 100% !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  color: var(--hr-rose-deep) !important;
  background: #342a33 !important;
  border-top: 1px solid #654c5c;
  box-shadow: 0 -4px 18px rgba(12, 8, 12, .07);
  line-height: 1.6;
}
.inside-banner[style] button {
  color: var(--hr-rose-deep);
  background: #332339;
  border: 1px solid #865578;
  border-radius: 8px;
  padding: 5px 10px;
}

/* 導覽改為流式排列，避免舊版 absolute + 740px 固定寬度互相擠壓。 */
#header .head-tool {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}
#header .head-tool > li { float: none !important; margin: 0 !important; }
@media (min-width: 801px) {
  #header .head-main {
    display: grid;
    grid-template-columns: minmax(200px, 1fr) auto;
    align-items: center;
    gap: 18px 24px;
  }
  #header .head-main::after { display: none !important; }
  #header .logo { grid-column: 1; float: none !important; margin: 0 !important; }
  #header .head-tool { grid-column: 2; position: static !important; }
  #header #nav { grid-column: 1 / -1; position: static !important; width: 100% !important; }
  #header #menu { display: flex; width: 100% !important; align-items: center; padding: 5px 12px; }
  #header #menu::after { display: none !important; }
  #header #menu > li { float: none !important; width: auto !important; flex: 1 1 0; }
  #header #menu > li > a { display: block; padding: 10px 8px; line-height: 1.65; }
}
@media (max-width: 800px) {
  #header .head-main { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 18px 14px; }
  #header .head-main::after { display: none !important; }
  #header .logo { float: none !important; margin: 0 !important; max-width: min(280px, 85%); }
  #header .head-tool { position: static !important; justify-content: center; }
  .slicknav_menu { top: 0 !important; min-height: 52px; z-index: 1000 !important; border-bottom: 1px solid var(--hr-line); }
  .slicknav_menu .slicknav_btn { position: relative !important; right: auto !important; min-height: 40px; }
  .inside-banner[style] { font-size: 12px; }
}

/* 聯絡頁：限定 contact-body，避免影響會員登入的表單切換。 */
.contact-body {
  box-sizing: border-box;
  width: 100%; max-width: 880px;
  margin: 0 auto 28px !important;
  padding: clamp(20px, 3vw, 36px) !important;
  background: #332339 !important;
  border: 1px solid var(--hr-line);
  border-radius: var(--hr-radius);
  box-shadow: var(--hr-shadow);
}
.contact-body .contact-info { margin: 0 0 26px !important; font-size: 15px; line-height: 1.85; overflow-wrap: anywhere; }
.contact-body .form-box { padding: 0 !important; margin: 0 !important; }
.contact-body .form-box form { margin: 0; }
.contact-body .opinion {
  display: grid !important;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  margin: 0 0 18px !important;
}
.contact-body .opinion::before, .contact-body .opinion::after { display: none !important; }
.contact-body .opinion-left01 {
  float: none !important;
  width: auto !important; min-width: 0;
  padding: 0 !important; margin: 0 !important;
  color: var(--hr-ink) !important;
  background: transparent !important;
  border: 0 !important;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.65;
}
.contact-body .input-main-style02 {
  float: none !important;
  width: 100% !important; min-width: 0;
  margin: 0 !important;
}
.contact-body textarea.input-main-style02 { min-height: 168px; resize: vertical; }
@supports selector(:has(*)) {
  .contact-body .opinion:has(textarea) { align-items: start; }
  .contact-body .opinion:has(textarea) .opinion-left01 { padding-top: 11px !important; }
}
.contact-body .cart-btn { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: stretch; gap: 12px; margin: 24px 0 0 !important; }
.contact-body .cart-btn .btn-cancel, .contact-body .cart-btn .btn-ok {
  display: inline-flex;
  justify-content: center; align-items: center;
  float: none !important;
  width: auto !important; min-width: 132px; min-height: 48px;
  margin: 0 !important;
  padding: 12px 24px !important;
  border-radius: 13px !important;
  font-size: 15px; font-weight: 600; line-height: 1.5;
}
.contact-body .cart-btn .btn-cancel { color: var(--hr-rose-deep) !important; background: #45333f !important; border: 1px solid #865578 !important; }
.contact-body .cart-btn .btn-cancel:hover { background: var(--hr-blush) !important; }
@media (max-width: 600px) {
  .contact-body { padding: 22px 17px !important; border-radius: 18px; }
  .contact-body .opinion { grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .contact-body .contact-info { font-size: 14px; margin-bottom: 22px !important; }
  .contact-body .opinion:has(textarea) .opinion-left01 { padding-top: 0 !important; }
  .contact-body .cart-btn { gap: 10px; }
  .contact-body .cart-btn .btn-cancel, .contact-body .cart-btn .btn-ok { flex: 1 1 120px; min-width: 0; padding: 12px 14px !important; }
}

/* v2 全站巡檢：舊樣式遺留的內縮、標題底圖和會員標籤。 */
.wrapper .content-body { width: 100% !important; max-width: none !important; }
.content-body > .side-bar { padding: 0 !important; }
.classBox .classLink > li > a { border-color: var(--hr-line) !important; }
.classBox.top { margin-bottom: 24px; }
.classBox.top .classLink { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 8px; }
.classBox.top .classLink > li { margin: 0 !important; }
.classBox.top .classLink > li > a { margin: 0 !important; border: 1px solid var(--hr-line) !important; }
.classBox.top .classLink > li > a::after { display: none !important; }
.in-left-menu.classBox .classLink > li > a::before { content: none !important; }

.i-pro > .title { border-bottom: 1px solid var(--hr-line) !important; margin-bottom: 24px; }
.i-pro > .title::after { display: none; }
.i-pro > .title > .i-pro-main {
  display: flex; flex-wrap: wrap;
  justify-content: space-between; align-items: center;
  gap: 14px 20px;
  width: 100% !important; max-width: none !important;
}
.i-pro > .title h3 {
  width: auto !important; margin: 0 !important;
  padding: 0 !important;
  color: var(--hr-rose-deep) !important;
  background: transparent !important;
  font-size: 24px; line-height: 1.5; font-weight: 600;
}
.i-pro .title .i-pro-main .more { position: static !important; width: auto !important; }
.i-pro .title .i-pro-main .more > a {
  display: inline-flex; align-items: center; gap: 9px;
  color: var(--hr-rose-deep) !important;
  font-size: 14px;
}
.i-pro .title .i-pro-main .more .more-left,
.i-pro .title .i-pro-main .more .more-right {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  color: inherit !important;
  background: transparent !important;
}
.i-pro-list > ul, .pro-list > ul { width: 100% !important; max-width: none !important; }
.pro-list > ul > li > h4 { min-height: 0 !important; }

/* 會員登入表單有些版本帶標籤、有些沒有；無標籤時欄位仍占滿一列。 */
.member-login-box .opinion { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-bottom: 18px !important; }
.member-login-box .opinion::before, .member-login-box .opinion::after { display: none !important; }
.member-login-box .opinion > .opinion-left01 {
  float: none !important; width: auto !important;
  padding: 0 !important; margin: 0 !important;
  background: transparent !important; border: 0 !important;
  color: var(--hr-ink) !important; font-size: 15px; font-weight: 600;
}
.member-login-box .opinion > .input-main-style02 { float: none !important; width: 100% !important; min-width: 0; }
@supports selector(:has(*)) {
  .member-login-box .opinion:has(> .opinion-left01) { grid-template-columns: 110px minmax(0, 1fr); align-items: center; }
}
.member-login-box > .page-title { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.member-login-box #logintype { margin-bottom: 0; min-width: 0; }

/* 消息列表保留標題和日期的原始順序，窄螢幕日期另列。 */
.news .news-list { padding: 0 !important; margin: 0 !important; border: 1px solid var(--hr-line) !important; border-radius: 18px; background: #332339; box-shadow: var(--hr-shadow); }
.news .news-list > li { padding: 15px 18px !important; border-bottom: 1px solid #503f4b !important; }
.news .news-list > li:last-child { border-bottom: 0 !important; }
.news .news-list > li.th { background: #58344e !important; border-radius: 17px 17px 0 0; }
.news .news-list > li > a { display: grid !important; grid-template-columns: 22px minmax(0, 1fr) 100px; align-items: start; gap: 10px; color: var(--hr-ink) !important; }
.news .news-list > li > a > i.fa { float: none !important; width: auto !important; color: var(--hr-rose); }
.news .news-list .news-lis-cont { float: none !important; width: auto !important; overflow-wrap: anywhere; line-height: 1.75; }
.news .news-list li span { float: none !important; width: auto !important; color: var(--hr-muted) !important; font-variant-numeric: tabular-nums; font-style: normal !important; }
.news .news-list > li.th { display: grid; grid-template-columns: 22px minmax(0, 1fr) 100px; gap: 10px; }
.news .news-list > li.th > i { float: none !important; width: auto !important; }
.news .news-list li:hover a .news-lis-cont { color: var(--hr-rose-deep) !important; }
.news-detail .time { float: none !important; width: auto !important; padding: 0 !important; text-align: left !important; }
.page-main { clear: both; }
.page-main table { max-width: 100% !important; }

/* 詳細頁只處理文字區與資料表外觀，不改原本相片輪播尺寸或 transform。 */
.pro-detaile .pro-info { overflow-wrap: anywhere; }
.pro-detaile .pro-detaile-title, .pro-detaile .pro-introduce { color: var(--hr-ink) !important; border-color: var(--hr-line) !important; line-height: 1.6; }
.pro-detaile .pro-content { color: var(--hr-ink) !important; line-height: 1.8; }
.pro-detaile .pro-tab span { color: var(--hr-rose-deep) !important; background: var(--hr-blush) !important; border: 1px solid var(--hr-line); border-radius: 9px; }

@media (max-width: 800px) {
  .i-pro > .title h3 { font-size: 21px; }
  .classBox.top .classLink { justify-content: flex-start; }
  /* 會員/人物明細資料表沿用原站 900px 以下的列式排版。 */
  .pro-detaile .pro-info { padding-left: 0 !important; }
}
@media (max-width: 600px) {
  .member-login-box .opinion:has(> .opinion-left01) { grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .member-login-box #logintype { width: 100%; }
  .news .news-list > li.th { display: none !important; }
  .news .news-list > li > a { grid-template-columns: 20px minmax(0, 1fr); gap: 6px 8px; }
  .news .news-list > li > a > span { grid-column: 2; text-align: left; font-size: 12px; }
}

/* v3：避免亮白表面及泛白光效。原 logo 的黑字需要適度亮度的背板。 */
body { color-scheme: dark; }
#header .logo a {
  box-sizing: border-box; max-width: 100%;
  padding: 8px 12px;
  background: #b497a5;
  border: 1px solid #c0a5b2;
  border-radius: 14px;
}
#header .logo img { display: block; }
#header .logo a:hover { filter: none; }
#menu > li > a:hover, #menu > li > a:focus-visible { background: rgba(229, 203, 217, .06) !important; }
.i-pro-list .pro-photo::after, .pro-list .pro-photo::after { opacity: .35; }
.ui-widget-content, .ui-dialog .ui-dialog-buttonpane { color: var(--hr-ink); }
.ui-dialog .ui-button { color: #f3deed !important; background: #7b4169 !important; border-color: #7b596d !important; }
/* 主題只調整既有文字區；編輯器中的黑字也須維持可讀性。 */
.page-main :where([style*="color:#000"], [style*="color: #000"], [style*="color:black"], [style*="color: black"], [style*="color: rgb(0, 0, 0)"]) { color: var(--hr-ink) !important; }
.page-main :where([style*="color:red"], [style*="color: red"], [style*="color:#ff0000"], [style*="color: #ff0000"], [style*="color: rgb(255, 0, 0)"]) { color: #f3aebb !important; }
/* 原本白字區不是可見標題，隱藏並移除佔位。 */
.wrapper h1[style*="color:white"], .wrapper h1[style*="color: white"] { display: none !important; }

/* v4 — 消息表頭：clearfix 偽元素不應參與 Grid，自動分欄也改為明確定位。 */
.news .news-list > li::before, .news .news-list > li::after,
.news .news-list > li > a::before, .news .news-list > li > a::after {
  display: none !important; content: none !important;
}
.news .news-list > li.th {
  color: var(--hr-ink) !important;
  grid-template-columns: 22px minmax(0, 1fr) 100px;
  align-items: center;
  min-height: 52px;
  height: auto !important;
}
.news .news-list > li.th > i { grid-column: 1; grid-row: 1; }
.news .news-list > li.th > .news-lis-cont { grid-column: 2; grid-row: 1; color: var(--hr-ink) !important; }
.news .news-list > li.th > span { grid-column: 3; grid-row: 1; white-space: nowrap; text-align: right; }
.news .news-list > li > a > .news-lis-cont { min-width: 0; }
.news .news-list > li > a > span { white-space: nowrap; }

/* 選單收合、焦點與選項各自指定顏色，不依賴透明 option 的原生白底。 */
#logintype, #logintype:focus, #logintype:active {
  color-scheme: dark;
  color: #f3deed !important;
  background-color: #2d2233 !important;
  font-size: 16px;
}
#logintype option, .member-login-box select option {
  color: #f3deed !important;
  background-color: #2d2233 !important;
  font-size: 16px;
}
#logintype option:checked, #logintype option:hover, #logintype option:focus {
  color: #fff0f7 !important;
  background-color: #7b4169 !important;
}
@media (forced-colors: active) {
  #logintype, #logintype option, .member-login-box select option {
    color: CanvasText !important; background: Canvas !important;
    forced-color-adjust: auto;
  }
  #logintype option:checked { color: HighlightText !important; background: Highlight !important; }
}

/* 內頁上方標題區：縮小字級與整體高度，固定底部提示列不套用。 */
body > .inside-banner:not([style]) { min-height: 100px !important; padding: 17px 20px !important; }
.inside-banner:not([style]) .banner-title { padding: 5px 12px !important; }
.inside-banner:not([style]) .banner-title strong { font-size: 22px !important; letter-spacing: .06em; }
.inside-banner:not([style]) .banner-title .glyphicon { font-size: 21px !important; vertical-align: baseline; }
.inside-banner:not([style]) .banner-title em { font-size: 11px !important; margin-top: 5px; letter-spacing: .14em; }

/* 新 SVG Logo：替換 img src 後移除舊黑字 Logo 使用的灰粉背板。 */
#header .logo a:has(> img[src*="honey-logo-20261001"]) {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}
#header .logo img[src*="honey-logo-20261001"] { width: 320px; max-width: 100%; height: auto; }
@media (max-width: 800px) {
  body > .inside-banner:not([style]) { min-height: 88px !important; padding: 14px 16px !important; }
  .inside-banner:not([style]) .banner-title strong { font-size: 20px !important; }
  .inside-banner:not([style]) .banner-title .glyphicon { font-size: 19px !important; }
  #header .logo img[src*="honey-logo-20261001"] { width: 280px; }
}
@media (max-width: 600px) { .news .news-list > li.th { display: none !important; } }

/* 莓粉 × 細金線：保留低亮度底色，用小面積的明亮色提高層次。 */
#nav.b-color { border-color: rgba(214, 178, 104, .28) !important; }
#menu > li > a::after { background: var(--hr-gold); }
.classBox .classLink > li > a.current,
.classBox .classLink > li.current > a { box-shadow: inset 3px 0 0 var(--hr-gold); }
.page-title { border-bottom-color: rgba(214, 178, 104, .22) !important; }
.cart-btn .btn-ok { border-color: rgba(214, 178, 104, .27) !important; }
.contact-body, .page-main, .member-login-box { border-color: rgba(214, 178, 104, .2) !important; }
.inside-banner:not([style]) .banner-title .glyphicon { color: var(--hr-gold) !important; }
.inside-banner:not([style]) .banner-title em { color: #ceb781 !important; }
.inside-banner:not([style]) .banner-title strong { color: #f0cbe0 !important; }

/* 手機上半部：slicknav 仍保留原 HTML/JS，只調整定位。
 * 收合按鈕位於 Logo 同一列右側；展開內容浮在它下方，不再另占空白頂列。
 */
@media (max-width: 800px) {
  #header .head-main {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    width: 100% !important; max-width: none !important;
    gap: 11px;
    padding: 15px 16px 14px !important;
  }
  #header .logo {
    grid-column: 1; grid-row: 1;
    justify-self: start;
    width: 220px; max-width: calc(100% - 62px) !important;
  }
  #header .logo a { display: block; }
  #header .logo img[src*="honey-logo-20261001"] { display: block; width: 220px; }
  #header .head-tool {
    grid-column: 1; grid-row: 2;
    justify-content: flex-start !important;
    align-items: center;
    gap: 8px;
    width: 100%;
  }
  #header .head-tool > li { flex: 0 1 auto; }
  #header .head-tool a.member {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 36px;
    padding: 7px 15px !important;
    color: #f2b4d9 !important;
    border-color: rgba(214, 178, 104, .3) !important;
    font-size: 13px; line-height: 1.4;
  }
  body > .slicknav_menu {
    box-sizing: border-box;
    position: absolute !important;
    top: 27px !important; right: 16px !important; left: auto !important;
    width: 44px !important;
    min-height: 44px !important; height: auto;
    padding: 0 !important; margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    overflow: visible;
    z-index: 2000 !important;
  }
  body > .slicknav_menu .slicknav_btn {
    display: flex; align-items: center; justify-content: center;
    position: relative !important;
    float: none !important;
    top: auto !important; right: auto !important;
    box-sizing: border-box;
    width: 44px; height: 44px; min-height: 44px;
    padding: 0 !important; margin: 0 !important;
    border: 1px solid rgba(214, 178, 104, .36) !important;
    border-radius: 12px !important;
    background: #69395c !important;
  }
  body > .slicknav_menu .slicknav_menutxt {
    display: block !important; position: absolute !important;
    width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
    border: 0;
  }
  body > .slicknav_menu .slicknav_icon { float: none !important; margin: 0 !important; width: 20px; height: auto; }
  body > .slicknav_menu .slicknav_icon-bar { width: 20px; height: 2px; border-radius: 2px; box-shadow: none; background-color: #e6c783 !important; }
  body > .slicknav_menu .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 4px; }
  body > .slicknav_menu .slicknav_nav {
    box-sizing: border-box;
    position: absolute; top: 53px; right: 0; left: auto;
    width: min(290px, calc(100vw - 32px));
    margin: 0 !important; padding: 9px !important;
    color: var(--hr-ink) !important;
    background: #332339 !important;
    border: 1px solid rgba(214, 178, 104, .3);
    border-radius: 14px;
    box-shadow: 0 15px 35px rgba(10, 6, 16, .4);
    /* 不指定 display/height，讓 slicknav 繼續控制開關。 */
  }
  body > .slicknav_menu .slicknav_nav > li { border-color: #62405b !important; }
  body > .slicknav_menu .slicknav_nav > li > a { min-height: 44px; padding: 11px 12px !important; margin: 0 !important; }
  body > .inside-banner:not([style]) { min-height: 76px !important; padding: 10px 16px !important; }
}
@media (max-width: 360px) {
  #header .logo, #header .logo img[src*="honey-logo-20261001"] { width: 200px; }
  body > .slicknav_menu { top: 23px !important; }
}

/* clearfix 的佔位偽元素也會打亂頂部 Grid/Flex，統一移除兩側。 */
#header .head-main::before, #header .head-main::after,
#header .head-tool::before, #header .head-tool::after,
#header #menu::before, #header #menu::after {
  content: none !important; display: none !important;
}
@media (min-width: 801px) {
  #header .logo, #header .head-tool { grid-row: 1; }
  #header #nav { grid-row: 2; }
}

/* v5：內頁名稱是導覽標題，改為靠左的精簡列，不再使用大橫幅。 */
body > .inside-banner:not([style]) {
  min-height: 0 !important;
  height: auto !important;
  padding: 15px 0 12px !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(214, 178, 104, .14) !important;
}
body > .inside-banner:not([style])::before,
body > .inside-banner:not([style])::after {
  content: none !important; display: none !important;
}
.inside-banner:not([style]) .banner-title {
  box-sizing: border-box;
  display: flex !important;
  align-items: center; justify-content: flex-start;
  gap: 9px;
  width: calc(100% - 48px); max-width: 1152px;
  margin: 0 auto !important; padding: 0 !important;
  font-size: 18px !important; line-height: 1.4 !important;
  text-align: left !important;
}
.inside-banner:not([style]) .banner-title strong {
  min-width: 0;
  font-size: 18px !important; line-height: 1.4 !important;
  letter-spacing: .035em !important;
}
.inside-banner:not([style]) .banner-title .glyphicon {
  flex: 0 0 auto;
  font-size: 16px !important; line-height: 1.4 !important;
  top: 0 !important; opacity: .9;
}
.inside-banner:not([style]) .banner-title em {
  margin: 0 0 0 auto !important;
  font: normal 10px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  color: var(--hr-muted) !important; letter-spacing: .08em;
}
.wrapper { padding-bottom: 0 !important; }
.wrapper > .main { padding-top: 18px; padding-bottom: 28px; }
.wrapper .page-title {
  padding: 0 0 10px !important;
  margin: 0 0 16px !important;
  font-size: 18px !important; line-height: 1.5 !important;
}
.wrapper .page-main {
  box-sizing: border-box; min-width: 0; max-width: 100%;
  margin: 0 0 24px !important;
}

/* 原站的手機分類是 JS 複製的 .m_classLink，與頂部 slicknav 為不同選單。
 * 僅改其外觀/位置，ul 的 display 與動畫高度由原 slideDown/slideUp 控制。
 */
.m_classLink {
  box-sizing: border-box; width: 100%; min-width: 0;
  margin: 0 !important; text-align: left;
}
.m_classLink > a.main {
  box-sizing: border-box;
  display: flex !important; align-items: center; justify-content: space-between;
  gap: 12px; width: 100%; min-width: 0; min-height: 44px;
  padding: 11px 13px !important;
  font-size: 14px !important; line-height: 1.5 !important;
  color: var(--hr-rose-deep) !important;
  background: #51304b !important;
  border: 1px solid rgba(214, 178, 104, .35) !important;
  border-radius: 11px;
  text-decoration: none !important;
}
.m_classLink > a.main b { min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.m_classLink > a.main > i {
  display: block !important; position: static !important;
  flex: 0 0 8px; width: 8px; height: 8px;
  margin: -4px 3px 0 0; color: var(--hr-gold) !important;
}
/* 清除原站行內 style 的紅色三角 emoji，以金色 CSS 箭頭取代。 */
.m_classLink > a.main > i::before {
  content: "" !important; display: block;
  box-sizing: border-box; width: 8px; height: 8px;
  padding: 0; margin: 0;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  font-size: 0 !important; line-height: 1 !important;
}
.m_classLink > a.main > i.fa-angle-up::before { transform: rotate(225deg); }
.m_classLink > ul {
  box-sizing: border-box; position: static !important;
  top: auto !important; left: auto !important; right: auto !important;
  width: 100% !important; min-width: 0;
  padding: 5px !important; margin: 8px 0 0 !important;
  list-style: none;
  background: #332339 !important;
  border: 1px solid rgba(214, 178, 104, .24) !important;
  border-radius: 11px; box-shadow: none;
}
.m_classLink > ul::before, .m_classLink > ul::after { content: none !important; display: none !important; }
.m_classLink > ul > li {
  float: none !important; width: auto !important;
  padding: 0 !important; margin: 0 !important; border: 0 !important;
}
.m_classLink > ul > li > a {
  box-sizing: border-box; display: block;
  min-height: 44px; padding: 11px 12px !important;
  font-size: 14px !important; line-height: 1.5 !important;
  color: var(--hr-ink) !important; background: transparent !important;
  border: 0 !important; border-radius: 8px;
  text-align: left !important; text-decoration: none;
  overflow-wrap: anywhere;
}
.m_classLink > ul > li > a::before,
.m_classLink > ul > li > a::after { content: none !important; display: none !important; }
.m_classLink > ul > li > a.current,
.m_classLink > ul > li > a:hover,
.m_classLink > ul > li > a:focus-visible {
  color: var(--hr-rose-deep) !important;
  background: #51304b !important;
  box-shadow: inset 2px 0 0 var(--hr-gold);
}
.m_classLink a:focus-visible { outline: 2px solid var(--hr-gold); outline-offset: 2px; }

@media (max-width: 800px) {
  body > .inside-banner:not([style]) { padding: 11px 0 9px !important; }
  .inside-banner:not([style]) .banner-title { width: auto; max-width: none; margin: 0 14px !important; gap: 8px; }
  .inside-banner:not([style]) .banner-title strong { font-size: 17px !important; }
  .inside-banner:not([style]) .banner-title .glyphicon { font-size: 15px !important; }
  .wrapper > .main { padding-top: 14px; padding-bottom: 22px; }
  .wrapper .page-title { font-size: 16px !important; margin-bottom: 14px !important; }
  .classBox.top { margin-bottom: 16px; }
}
@media (max-width: 640px) {
  /* 與原站的分類選單切換斷點一致；避免桌面分類與手機分類重複顯示。 */
  .classBox > ul.classLink,
  .classBox.top > ul.classLink { display: none !important; }
  .classBox > .m_classLink { display: block; }
  .classBox.top { padding: 8px !important; border-radius: 14px; }
  .content-body > .side-bar { margin-bottom: 14px !important; }
  .inside-banner:not([style]) .banner-title em { display: none !important; }
  .wrapper .page-main { margin: 0 0 18px !important; padding: 19px 15px !important; }
  body > .slicknav_menu .slicknav_nav { max-width: calc(100vw - 32px); }
}
@media (max-width: 360px) {
  .inside-banner:not([style]) .banner-title { margin-left: 10px !important; margin-right: 10px !important; }
}

/* v6：有手機分類選擇框時，以該框顯示目前項目，不重複顯示頁首/項目標題。 */
@media (max-width: 640px) {
  body:has(.classBox > .m_classLink) > .inside-banner:not([style]),
  .content-body > .classBox:has(> .m_classLink) + .page-title {
    display: none !important;
  }
  .m_classLink > a.main { font-size: 15px !important; }
}

/* 手機上版單排：Logo + 通知/會員小圖示 + 原 slicknav 按鈕。
 * 文字仍保留在原 anchor 中供輔助工具讀取；不替換連結、onclick 或 JS。
 */
@media (max-width: 800px) {
  #header .head-main {
    grid-template-columns: minmax(0, 1fr) auto !important;
    column-gap: 8px; row-gap: 0;
    padding: 12px 60px 12px 16px !important;
  }
  #header .logo {
    grid-column: 1 !important; grid-row: 1 !important;
    width: 174px; min-width: 0; max-width: 100% !important;
  }
  #header .logo img, #header .logo img[src*="honey-logo-20261001"] {
    width: 174px; max-width: 100% !important; height: auto;
  }
  #header .head-tool {
    grid-column: 2 !important; grid-row: 1 !important;
    width: auto !important; min-width: 0;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important; gap: 6px;
  }
  #header .head-tool > li { flex: 0 0 auto; }
  #header .head-tool a.member {
    box-sizing: border-box;
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 36px; min-height: 36px;
    padding: 0 !important; margin: 0 !important;
    border-radius: 10px !important;
    font-size: 0 !important; line-height: 0 !important;
    color: var(--hr-gold) !important;
    background: #332339 !important;
    border: 1px solid rgba(214, 178, 104, .3) !important;
  }
  #header .head-tool a.member::before {
    content: ""; display: block;
    width: 18px; height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M4%2021v-2a8%208%200%200%201%2016%200v2%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M4%2021v-2a8%208%200%200%201%2016%200v2%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  }
  #header .head-tool a.member[href^="javascript:"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M18%208a6%206%200%200%200-12%200c0%207-3%207-3%209h18c0-2-3-2-3-9%22%2F%3E%3Cpath%20d%3D%22M10%2021h4M12%202v1%22%2F%3E%3C%2Fsvg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M18%208a6%206%200%200%200-12%200c0%207-3%207-3%209h18c0-2-3-2-3-9%22%2F%3E%3Cpath%20d%3D%22M10%2021h4M12%202v1%22%2F%3E%3C%2Fsvg%3E");
  }
  body > .slicknav_menu {
    top: 20px !important; right: 16px !important;
    width: 36px !important; min-height: 36px !important;
  }
  body > .slicknav_menu .slicknav_btn {
    width: 36px !important; height: 36px !important; min-height: 36px !important;
    border-radius: 10px !important;
  }
  body > .slicknav_menu .slicknav_icon { width: 18px; }
  body > .slicknav_menu .slicknav_icon-bar { width: 18px; }
  body > .slicknav_menu .slicknav_nav { top: 45px; }
}

/* 捲動進場：由同版本 motion.js 加上狀態 class；未載入 JS 時內容正常顯示。 */
html.hr-motion-ready .hr-reveal { opacity: 0; translate: 0 12px; }
html.hr-motion-ready .hr-reveal.hr-inview {
  opacity: 1; translate: 0 0;
  animation: hr-reveal-in .55s var(--hr-ease) both;
  animation-delay: var(--hr-reveal-delay, 0ms);
}
@keyframes hr-reveal-in {
  from { opacity: 0; translate: 0 12px; }
  to { opacity: 1; translate: 0 0; }
}
@media (hover: hover) and (pointer: fine) {
  .i-pro-list > ul > li:hover, .pro-list > ul > li:hover {
    border-color: rgba(214, 178, 104, .55) !important;
    box-shadow: 0 14px 30px rgba(12, 8, 16, .25), 0 0 0 1px rgba(214, 178, 104, .07);
  }
}
@media (max-width: 800px) {
  html.hr-motion-ready .hr-reveal { translate: 0 7px; }
  html.hr-motion-ready .hr-reveal.hr-inview {
    translate: 0 0;
    animation-name: hr-reveal-in-mobile; animation-duration: .4s;
  }
  @keyframes hr-reveal-in-mobile {
    from { opacity: 0; translate: 0 7px; }
    to { opacity: 1; translate: 0 0; }
  }
}
@media (prefers-reduced-motion: reduce) {
  html.hr-motion-ready .hr-reveal,
  html.hr-motion-ready .hr-reveal.hr-inview {
    opacity: 1 !important; translate: none !important; animation: none !important;
  }
}
@media print {
  html.hr-motion-ready .hr-reveal { opacity: 1 !important; translate: none !important; animation: none !important; }
}

/* v7：人物列表的分類在 side-bar，重複標題則在 pro-list-main。
 * 與原站 640px 分類下拉切換同步，只隱藏該列表欄頂部的分類標題。
 */
@media (max-width: 640px) {
  .content-body > .side-bar:has(.m_classLink) ~ .pro-list-main > .page-title {
    display: none !important;
  }
  .content-body > .side-bar:has(.m_classLink) {
    margin-bottom: 16px !important;
  }
}

/* v8：會員各頁以側欄中的 /member/ 連結辨識，避免改動其他頁的表格/表單。 */
.content-body:has(.side-bar a[href*="/member/"]) {
  --hr-member-columns: minmax(0, .9fr) minmax(0, 1.15fr) minmax(0, 2fr);
}
.content-body > .side-bar ~ .cor-075 {
  box-sizing: border-box; min-width: 0;
  width: 100% !important; float: none !important; margin: 0 !important;
}
@media (min-width: 801px) {
  .content-body:has(> .side-bar) > .cor-075 {
    width: auto !important; grid-column: 2;
  }
}

/* 會員資料：標籤、唯讀資訊、可編輯欄位均放入同一個流式欄位網格。 */
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 > form { min-width: 0; }
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .form-box {
  box-sizing: border-box; margin: 0 0 20px !important;
  padding: 22px !important;
  color: var(--hr-ink); background: var(--hr-surface) !important;
  border: 1px solid rgba(214, 178, 104, .23);
  border-radius: 18px;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion {
  display: grid !important;
  grid-template-columns: 136px minmax(0, 1fr);
  align-items: start; gap: 10px 16px;
  margin: 0 0 17px !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion::before,
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion::after {
  content: none !important; display: none !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion > .opinion-left01 {
  box-sizing: border-box; float: none !important; width: auto !important;
  margin: 0 !important; padding: 11px 0 !important;
  color: var(--hr-muted) !important;
  background: transparent !important; border: 0 !important;
  font-size: 14px !important; font-weight: 600; line-height: 1.6 !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion > .input-main-style02 {
  box-sizing: border-box; float: none !important;
  width: 100% !important; min-width: 0;
  margin: 0 !important; padding: 11px 13px !important;
  font-size: 15px !important; line-height: 1.7 !important;
  overflow-wrap: anywhere;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion > div.input-main-style02 {
  color: var(--hr-ink) !important; background: #38273e !important;
  border: 1px solid rgba(214, 178, 104, .18) !important;
  border-radius: 11px !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .form-box input[type="text"] {
  font-size: 16px !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .form-box input[type="text"]:focus {
  color: var(--hr-ink) !important; background: #3a2840 !important;
}
.content-body:has(.side-bar a[href*="/member/"]) :where([style*="color:green"], [style*="color: green"]) {
  color: #a2dfbd !important;
}
.content-body:has(.side-bar a[href*="/member/"]) :where([style*="color:red"], [style*="color: red"]) {
  color: #f0a8c1 !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .btn-ok,
.content-body:has(.side-bar a[href*="/member/"]) input[type="button"] {
  box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center;
  float: none !important; max-width: 100%; min-height: 38px;
  padding: 8px 13px !important;
  color: var(--hr-ink) !important;
  background: linear-gradient(115deg, #78305c, #633556) !important;
  border: 1px solid rgba(214, 178, 104, .3) !important;
  border-radius: 10px !important;
  font-size: 14px !important; line-height: 1.5 !important;
  text-align: center; text-decoration: none;
  white-space: normal; overflow-wrap: anywhere;
  cursor: pointer;
}
.content-body:has(.side-bar a[href*="/member/"]) .opinion > .btn-ok { justify-self: start; margin: 0 !important; }
.content-body:has(.side-bar a[href*="/member/"]) .btn-ok[style*="#00b900"] {
  background: #266a4d !important; border-color: #448b69 !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cart-btn { margin: 18px 0 24px !important; }

/* 會員資料表：依實際三/四/六欄表頭設定欄數，取消 116px 固定寬度。 */
.content-body:has(.side-bar a[href*="/member/"]) .order-list:not(ul) {
  padding: 0 !important; min-width: 0;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table {
  display: block !important;
  width: 100% !important; min-width: 0;
  padding: 0 !important; margin: 0 0 20px !important;
  list-style: none; overflow: hidden;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(4):last-child) {
  --hr-member-columns: minmax(0, 1.15fr) minmax(0, .85fr) minmax(0, 2fr) minmax(0, .7fr);
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) {
  --hr-member-columns: minmax(0, .65fr) minmax(0, .6fr) minmax(0, .6fr) minmax(0, 1.8fr) minmax(0, 1.3fr) minmax(0, 1.2fr);
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li {
  box-sizing: border-box; display: grid !important;
  grid-template-columns: var(--hr-member-columns);
  align-items: start; gap: 12px;
  width: 100%; margin: 0 !important; padding: 14px 16px !important;
  border-bottom: 1px solid var(--hr-line) !important;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li::before,
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li::after {
  content: none !important; display: none !important;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li > :is(.order-list-th, .order-list-td) {
  box-sizing: border-box; display: block !important;
  width: auto !important; min-width: 0;
  margin: 0 !important; padding: 0 !important;
  float: none !important; border: 0 !important;
  text-align: left !important;
  font-size: 14px !important; line-height: 1.7 !important;
  overflow-wrap: anywhere; word-break: normal;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table .order-list-th { font-weight: 600; }
.content-body:has(.side-bar a[href*="/member/"]) .order-list-td a:not(.btn-ok) { color: var(--hr-rose-deep) !important; }
.content-body:has(.side-bar a[href*="/member/"]) .order-list-td .oproject { display: none !important; }
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:not(:has(> li:not(.th)))::after {
  content: "目前沒有資料"; display: block;
  padding: 20px; color: var(--hr-muted);
  font-size: 14px; text-align: center;
}

/* 抵用金數字與規則不是同一字級：金額正常強調，規則獨立小字閱讀區。 */
.content-body:has(.side-bar a[href*="/member/"]) .order-numb {
  box-sizing: border-box; margin: 0 0 18px !important;
  padding: 16px 18px;
  color: var(--hr-rose-deep) !important;
  background: #38273e; border: 1px solid rgba(214, 178, 104, .23);
  border-radius: 14px;
  font-size: 18px !important; font-weight: 600; line-height: 1.7 !important;
  overflow-wrap: anywhere;
}
.content-body:has(.side-bar a[href*="/member/"]) .order-numb .note {
  padding-top: 10px; margin-top: 10px;
  border-top: 1px solid var(--hr-line);
  color: var(--hr-muted) !important;
  font-size: 13px !important; font-weight: 400; line-height: 1.85 !important;
}
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 > .shopping-car {
  box-sizing: border-box; padding: 20px !important;
  background: var(--hr-surface); border: 1px solid var(--hr-line);
  border-radius: 18px;
}
.content-body:has(.side-bar a[href*="/member/"]) .pro-list-main > br.hr-extra-break { display: none; }
.content-body:has(.side-bar a[href*="/member/"]) .pro-list-main > .cart-btn {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}
.content-body:has(.side-bar a[href*="/member/"]) .pro-list-main > .cart-btn > br { display: none; }
.content-body:has(.side-bar a[href*="/member/"]) .pro-list-main > .cart-btn > font { flex-basis: 100%; color: var(--hr-muted) !important; font-size: 13px; line-height: 1.7; }

/* 轉盤容器按內容欄縮放，Canvas 和指針沿用原座標/比例，旋轉 JS 不變。 */
.content-body:has(.turnplate) .form-box > .banner {
  width: min(100%, 390px) !important; height: auto !important;
  margin: 0 auto 22px !important; overflow: visible !important;
}
.content-body .turnplate { width: 100% !important; aspect-ratio: 1; position: relative; }
.content-body .turnplate > canvas.item { display: block; width: 100% !important; height: auto !important; aspect-ratio: 1; }
.content-body .turnplate > img.pointer {
  position: absolute !important;
  width: 31.5% !important; height: 42.5% !important;
  left: 34.6% !important; top: 23% !important;
}
.content-body:has(.turnplate) .checkout-box {
  box-sizing: border-box; padding: 16px 18px !important;
  margin: 0 0 16px !important;
  background: var(--hr-surface) !important;
  color: var(--hr-ink); border: 1px solid var(--hr-line) !important;
  border-radius: 14px;
  font-size: 14px; line-height: 1.85; overflow-wrap: anywhere;
}

@media (max-width: 1000px) {
  /* 窄電腦/平板也切換卡片，避免側欄旁的表格過度壓縮。 */
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table {
    border: 0 !important; background: transparent !important;
    box-shadow: none;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li.th { display: none !important; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table > li:not(.th) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 0 12px !important; padding: 15px !important;
    background: var(--hr-surface) !important;
    border: 1px solid rgba(214, 178, 104, .23) !important;
    border-radius: 14px;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table .order-list-td .oproject {
    display: block !important; margin: 0 0 3px;
    color: var(--hr-muted) !important;
    font-size: 12px !important; line-height: 1.5;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(3):last-child) > li:not(.th) > .order-list-td:nth-child(3),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(4):last-child) > li:not(.th) > .order-list-td:nth-child(n+3),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(4),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(6) {
    grid-column: 1 / -1;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(4):last-child) > li:not(.th) > .order-list-td:nth-child(4):not(:has(.oproject))::before {
    content: "評分"; display: block; margin-bottom: 3px;
    color: var(--hr-muted); font-size: 12px; line-height: 1.5;
  }
}
@media (max-width: 800px) {
  .content-body:has(.side-bar a[href*="/member/"]) .cor-075 .form-box { padding: 18px !important; }
  .content-body:has(.side-bar a[href*="/member/"]) .order-numb { font-size: 17px !important; padding: 14px 15px; }
}
@media (max-width: 640px) {
  /* 分類選擇框已是標題；補齊 cor-075 與其內 form 的會員頁結構。 */
  .content-body > .side-bar:has(.m_classLink) ~ .cor-075 > .page-title,
  .content-body > .side-bar:has(.m_classLink) ~ .cor-075 > form > .page-title {
    display: none !important;
  }
  .content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion {
    grid-template-columns: minmax(0, 1fr); gap: 6px;
    margin-bottom: 16px !important;
  }
  .content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion > .opinion-left01 { padding: 0 !important; }
  .content-body:has(.side-bar a[href*="/member/"]) .cor-075 .cart-btn .btn-ok { width: 100%; margin: 0 !important; }
  .content-body:has(.side-bar a[href*="/member/"]) .cor-075 > .shopping-car { padding: 16px !important; }
  .content-body:has(.turnplate) .form-box > .banner { width: min(100%, 330px) !important; }
  /* 優惠券標題中的使用說明連結仍可見，標題文字則由選擇框取代。 */
  .content-body > .side-bar:has(.m_classLink) ~ .pro-list-main > .page-title:has(span a) {
    display: flex !important; justify-content: flex-end;
    font-size: 0 !important; line-height: 0 !important;
    padding: 0 !important; margin: 0 0 8px !important; border: 0 !important;
  }
  .content-body > .side-bar:has(.m_classLink) ~ .pro-list-main > .page-title > span { font-size: 12px !important; line-height: 1.5; }
}

/* 動態隱藏的會員欄位維持原顯示狀態，不因 Grid 規則重新出現。 */
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion[hidden],
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion[style*="display:none"],
.content-body:has(.side-bar a[href*="/member/"]) .cor-075 .opinion[style*="display: none"] {
  display: none !important;
}

.content-body:has(.side-bar a[href*="/member/"]) .pro-list-main > font {
  display: block; color: #e3afc8 !important; font-size: 14px; line-height: 1.75;
}

/* v9：有資料的優惠券六欄；金額與操作按鈕各有足夠寬度。 */
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) {
  --hr-member-columns: 64px 64px minmax(132px, 1.1fr) minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.4fr);
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li > .order-list-td.cart-btn {
  margin: 0 !important; text-align: left !important;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td > :is(.btn-ok, .btn-cancel) {
  box-sizing: border-box; display: inline-flex !important;
  align-items: center; justify-content: center;
  width: 100% !important; max-width: 100%; min-width: 0; min-height: 36px;
  margin: 0 !important; padding: 7px 9px !important;
  border: 1px solid rgba(214, 178, 104, .3) !important;
  border-radius: 9px !important;
  color: var(--hr-ink) !important; font-size: 13px !important;
  line-height: 1.5 !important; white-space: normal; text-decoration: none;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td > .btn-cancel {
  background: #483044 !important; box-shadow: none;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td > .btn-cancel:hover { background: #603e57 !important; }
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > input[type="number"] {
  box-sizing: border-box; display: block;
  width: 100% !important; max-width: 100%; min-width: 0; min-height: 40px;
  margin: 0 0 6px !important; padding: 8px 10px !important;
  color: var(--hr-ink) !important; background: #2d2233 !important;
  border: 1px solid #865578 !important; border-radius: 9px !important;
  font-size: 16px !important; line-height: 1.4 !important;
  color-scheme: dark;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > input[type="number"]::placeholder {
  color: var(--hr-muted); opacity: 1;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > a {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  width: 100%; max-width: 100%; min-height: 36px;
  padding: 7px 9px; color: var(--hr-rose-deep) !important;
  background: #483044; border: 1px solid rgba(214, 178, 104, .3);
  border-radius: 9px; font-size: 13px; line-height: 1.5;
  text-align: center; text-decoration: none; white-space: normal;
}
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > a:hover { background: #603e57; }
.content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(6) { font-variant-numeric: tabular-nums; white-space: normal; }

/* 拍賣場沒有會員側欄，以其獨立購物車列表結構限定樣式。 */
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) {
  box-sizing: border-box; width: 100% !important; max-width: 1100px;
  min-width: 0; margin: 0 auto !important; color: var(--hr-ink);
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion {
  display: block !important; margin: 0 0 18px !important;
  padding: 0 !important; border: 0 !important;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion::before, .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion::after {
  display: none !important; content: none !important;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion > .input-style01 {
  box-sizing: border-box; display: block; float: none !important;
  width: 100% !important; max-width: 480px; min-width: 0; min-height: 44px;
  margin: 0 !important; padding: 10px 14px !important;
  color: var(--hr-ink) !important; background: #2d2233 !important;
  border: 1px solid #865578 !important; border-radius: 11px !important;
  font-size: 16px !important; line-height: 1.4;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion > .input-style01::placeholder { color: var(--hr-muted); opacity: 1; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .opinion > .input-style01:focus {
  background: #3a2840 !important; border-color: var(--hr-rose) !important;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .shopping-car {
  box-sizing: border-box; min-width: 0;
  padding: 0 !important; margin: 0 0 20px !important;
  color: var(--hr-ink); background: transparent !important;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list {
  box-sizing: border-box; display: block !important;
  width: 100% !important; min-width: 0;
  margin: 0 !important; padding: 0 !important;
  list-style: none; background: var(--hr-surface);
  border: 1px solid var(--hr-line) !important; border-radius: 15px;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li {
  box-sizing: border-box; display: grid !important;
  grid-template-columns: 88px minmax(0, 2fr) minmax(80px, .75fr) minmax(155px, 1.2fr) minmax(100px, .85fr);
  align-items: center; gap: 12px;
  width: 100%; margin: 0 !important; padding: 16px !important;
  border: 0 !important; border-bottom: 1px solid var(--hr-line) !important;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:last-child { border-bottom: 0 !important; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li::before,
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li::after { display: none !important; content: none !important; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li > div {
  box-sizing: border-box; display: block !important; float: none !important;
  width: auto !important; height: auto !important; min-width: 0;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  color: var(--hr-ink) !important; font-size: 14px !important; line-height: 1.7 !important;
  text-align: left !important; overflow-wrap: anywhere; word-break: normal;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li.th {
  padding-top: 12px !important; padding-bottom: 12px !important;
  background: #58344e !important; border-radius: 14px 14px 0 0;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li.th > div {
  color: var(--hr-rose-deep) !important; font-size: 13px !important; font-weight: 600;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-name { font-weight: 600; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-price {
  color: var(--hr-rose-deep) !important; font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-subtotal {
  color: var(--hr-muted) !important; font-variant-numeric: tabular-nums;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shop-car-img img.pro-photo {
  box-sizing: border-box; display: block;
  width: 76px !important; max-width: 100% !important; height: 96px !important;
  margin: 0 !important; padding: 0 !important;
  object-fit: cover; object-position: center;
  border: 1px solid rgba(214, 178, 104, .3) !important; border-radius: 10px;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shopping-car .oproject { display: none !important; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shop-car-del a {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  max-width: 100%; min-width: 0; min-height: 38px;
  padding: 8px 13px !important;
  color: var(--hr-ink) !important; background: linear-gradient(115deg, #78305c, #633556) !important;
  border: 1px solid rgba(214, 178, 104, .3); border-radius: 10px;
  font-size: 14px !important; line-height: 1.5; text-decoration: none; white-space: normal;
}
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shop-car-del a:hover { background: #8b3e6c !important; }
.wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) > .page { margin: 18px 0 0; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  /* 六欄在側欄旁過窄時提早改成卡片，不壓縮拍賣欄。 */
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) { background: transparent !important; border: 0 !important; box-shadow: none; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li.th { display: none !important; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) {
    grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start;
    margin: 0 0 12px !important; padding: 15px !important; gap: 12px;
    background: var(--hr-surface) !important;
    border: 1px solid rgba(214, 178, 104, .23) !important; border-radius: 14px;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td,
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(5),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(6) { grid-column: auto; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(3),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(4) { grid-column: 1 / -1; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td .oproject {
    display: block !important; margin: 0 0 4px;
    color: var(--hr-muted) !important; font-size: 12px !important; line-height: 1.5;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(3) {
    display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > .oproject { flex-basis: 100%; margin: 0; }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > input[type="number"] {
    flex: 1 1 120px; width: auto !important; margin: 0 !important;
  }
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) .order-list-td:nth-child(3) > a { flex: 0 1 auto; width: auto; min-height: 40px; }
}
@media (max-width: 900px) {
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list { background: transparent !important; border: 0 !important; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li.th { display: none !important; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) {
    grid-template-columns: 76px minmax(0, 1fr);
    grid-template-areas: "photo name" "photo price" "expiry expiry" "action action";
    align-items: start; gap: 8px 14px;
    margin: 0 0 14px !important; padding: 15px !important;
    background: var(--hr-surface) !important;
    border: 1px solid rgba(214, 178, 104, .23) !important; border-radius: 15px;
  }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-img { grid-area: photo; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-name { grid-area: name; font-size: 15px !important; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-price { grid-area: price; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-subtotal { grid-area: expiry; padding-top: 6px !important; }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) ul.shopping-car-list > li:not(.th) > .shop-car-del {
    grid-area: action; padding-top: 10px !important; border-top: 1px solid var(--hr-line) !important;
  }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shopping-car .oproject {
    display: inline !important; color: var(--hr-muted) !important;
    font-size: 12px !important; font-weight: 400;
  }
  .wrapper .cart-body:has(ul.shopping-car-list li.th > .shop-car-del:nth-child(5):last-child) .shop-car-del a { width: 100%; }
}
@media (max-width: 480px) {
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(5),
  .content-body:has(.side-bar a[href*="/member/"]) ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(6):last-child) > li:not(.th) > .order-list-td:nth-child(6) { grid-column: 1 / -1; }
}

/* v10：人物詳細頁的聯絡按鈕，取消舊黃色、48% 寬度和浮動。 */
.wrapper .pro-detaile .cart-info a.check {
  box-sizing: border-box; display: inline-flex !important;
  align-items: center; justify-content: center;
  float: none !important;
  width: 100% !important; max-width: 320px; min-width: 0; min-height: 44px;
  margin: 0 !important; padding: 11px 18px !important;
  color: var(--hr-ink) !important;
  background: linear-gradient(115deg, #91406f, #703654) !important;
  border: 1px solid rgba(214, 178, 104, .5) !important;
  border-radius: 11px !important;
  box-shadow: 0 5px 14px rgba(12, 8, 12, .18);
  font-size: 14px !important; font-weight: 600; line-height: 1.5 !important;
  text-align: center; text-decoration: none; white-space: normal; overflow-wrap: anywhere;
  transition: background .2s ease, box-shadow .2s ease;
}
.wrapper .pro-detaile .cart-info a.check:hover {
  background: linear-gradient(115deg, #a2487e, #813d63) !important;
  box-shadow: 0 7px 18px rgba(12, 8, 12, .22);
}
.wrapper .pro-detaile .cart-info .color-green { color: var(--hr-rose-deep) !important; }

/* 客評是獨立的兩欄表；只接管詳細頁中的這種結構。 */
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) {
  box-sizing: border-box; display: block !important;
  width: 100% !important; min-width: 0;
  margin: 0 0 18px !important; padding: 0 !important;
  list-style: none; overflow: hidden;
}
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li {
  box-sizing: border-box; display: grid !important;
  grid-template-columns: minmax(96px, .8fr) minmax(0, 3fr);
  align-items: start; gap: 16px;
  width: 100% !important; min-width: 0;
  margin: 0 !important; padding: 14px 16px !important;
  border: 0 !important; border-bottom: 1px solid var(--hr-line) !important;
}
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li:last-child { border-bottom: 0 !important; }
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li::before, .wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li::after {
  display: none !important; content: none !important;
}
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li.th { display: grid !important; }
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li > :is(.order-list-th, .order-list-td) {
  box-sizing: border-box; display: block !important;
  float: none !important; width: auto !important; min-width: 0;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  font-size: 14px !important; line-height: 1.8 !important;
  text-align: left !important; white-space: normal;
  word-break: normal; overflow-wrap: anywhere;
}
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li > .order-list-td.numb { color: var(--hr-ink) !important; }
.wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) .order-list-td .oproject { display: none !important; }
.wrapper .pro-detaile .pro-introduce {
  font-size: 17px !important; margin-top: 22px !important; margin-bottom: 14px !important;
}
@media (max-width: 640px) {
  .wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) { background: transparent !important; border: 0 !important; box-shadow: none; overflow: visible; }
  .wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li.th { display: none !important; }
  .wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) > li:not(.th) {
    grid-template-columns: minmax(0, 1fr); gap: 9px;
    margin: 0 0 12px !important; padding: 14px !important;
    background: var(--hr-surface) !important;
    border: 1px solid rgba(214, 178, 104, .23) !important; border-radius: 12px;
  }
  .wrapper .pro-detaile .pro-content > ul.order-list.ul_table:has(li.th > .order-list-th:nth-child(2):last-child) .order-list-td .oproject {
    display: block !important; margin-bottom: 3px;
    color: var(--hr-muted) !important; font-size: 12px !important; line-height: 1.5;
  }
}

/* 電腦頁尾改為內容自然高度；有固定提示列時留出適量避讓空間。 */
@media (min-width: 801px) {
  footer > .footer {
    box-sizing: border-box; height: auto !important; min-height: 0 !important;
    padding: 10px 16px !important;
    font-size: 13px !important; line-height: 1.6 !important;
  }
  body:has(.inside-banner[style]) footer > .footer {
    padding-bottom: 54px !important;
  }
}

/* v11：頁碼區的裸文字也須覆寫原 .page 的 #333，不能只改連結。 */
.wrapper .page {
  box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0;
  height: auto !important; min-height: 0 !important;
  color: var(--hr-ink) !important;
  font-size: 14px !important; line-height: 1.9 !important;
  white-space: normal; overflow-wrap: anywhere;
}
.wrapper .page :where(span, strong, em, b) { color: inherit !important; }
.wrapper .page > a {
  box-sizing: border-box; display: inline-flex !important;
  align-items: center; justify-content: center;
  max-width: 100%; min-width: 0; min-height: 40px;
  margin: 6px 4px !important; padding: 8px 14px !important;
  color: var(--hr-rose-deep) !important;
  font-size: 14px !important; line-height: 1.5 !important;
  white-space: normal; vertical-align: middle;
}
.wrapper .page select {
  box-sizing: border-box; display: inline-block !important; float: none !important;
  width: 88px !important; min-width: 76px; max-width: 100%; min-height: 40px;
  margin: 4px 5px !important; padding: 8px 10px !important;
  color: var(--hr-ink) !important; background-color: #2d2233 !important;
  border: 1px solid #865578 !important; border-radius: 9px !important;
  font-size: 16px !important; line-height: 1.4 !important;
  vertical-align: middle; color-scheme: dark;
}
.wrapper .page select option {
  color: var(--hr-ink) !important; background-color: #2d2233 !important;
  font-size: 16px;
}
.wrapper .page select option:checked {
  color: #fff0f7 !important; background-color: #7b4169 !important;
}
@media (max-width: 800px) {
  .wrapper .page { margin-top: 20px !important; margin-bottom: 18px !important; }
  /* 原站把所有頁碼 br 隱藏，手機恢復分行，總筆數/前後頁/跳頁各有空間。 */
  .wrapper .page > br { display: block !important; }
}
@media (forced-colors: active) {
  .wrapper .page { color: CanvasText !important; }
  .wrapper .page select, .wrapper .page select option {
    color: CanvasText !important; background-color: Canvas !important;
    forced-color-adjust: auto;
  }
  .wrapper .page select option:checked {
    color: HighlightText !important; background-color: Highlight !important;
  }
}

/* Honey Rose v12 補丁 — 2026-10-02
 * 沒有 li 卡片時，舊模板的 h3 + a 提示不可沿用商品三欄網格。
 * 本檔放在 v11 後；完整 v12 已含此段，二者擇一。
 */

/* 即使清單含有卡片，直接放在 ul 的文字提示也應跨欄。 */
.pro-list > ul > :is(h3, p, a) {
  grid-column: 1 / -1;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* 範圍限於原列表的空狀態，不影響首頁、會員表格或商品卡片。 */
.pro-list > ul:has(> h3):not(:has(> li)) {
  box-sizing: border-box;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: clamp(22px, 3vw, 32px) clamp(16px, 3vw, 28px) !important;
  color: var(--hr-ink, #f3deed);
  background: var(--hr-surface, #332339);
  border: 1px solid var(--hr-line, #664555);
  border-radius: 18px;
  box-shadow: var(--hr-shadow, 0 8px 24px rgba(18, 11, 22, .1));
  text-align: center;
  overflow-wrap: anywhere;
}
.pro-list > ul:has(> h3):not(:has(> li)) > h3 {
  box-sizing: border-box;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--hr-ink, #f3deed) !important;
  font-size: 18px !important;
  font-weight: 500;
  line-height: 1.8 !important;
  letter-spacing: .025em;
  text-align: center !important;
}
.pro-list > ul:has(> h3):not(:has(> li)) > a {
  box-sizing: border-box;
  display: block;
  float: none !important;
  width: fit-content !important;
  max-width: 100%;
  min-height: 44px;
  margin: 16px auto 0 !important;
  padding: 10px 18px !important;
  border: 1px solid rgba(214, 178, 104, .38);
  border-radius: 14px;
  color: var(--hr-rose-deep, #f2b4d9) !important;
  background: #503149;
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease;
}
.pro-list > ul:has(> h3):not(:has(> li)) > a > p {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit;
  line-height: inherit;
  text-align: inherit !important;
}
.pro-list > ul:has(> h3):not(:has(> li)) > a:focus-visible {
  outline: 2px solid #e997c3;
  outline-offset: 4px;
}
@media (hover: hover) {
  .pro-list > ul:has(> h3):not(:has(> li)) > a:hover {
    background: #603a53;
    border-color: rgba(214, 178, 104, .65);
  }
}
@media (max-width: 640px) {
  .pro-list > ul:has(> h3):not(:has(> li)) {
    padding: 22px 16px !important;
    border-radius: 15px;
  }
  .pro-list > ul:has(> h3):not(:has(> li)) > h3 {
    font-size: 16px !important;
    line-height: 1.8 !important;
  }
  .pro-list > ul:has(> h3):not(:has(> li)) > a {
    width: 100% !important;
    padding: 10px 12px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .pro-list > ul:has(> h3):not(:has(> li)) > a { transition: none !important; }
}