/*! tailwindcss v4.2.0 | MIT License | https://tailwindcss.com */
@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-1\/2{top:50%}.z-50{z-index:50}.order-1{order:1}.order-2{order:2}.container{width:100%}.mx-auto{margin-inline:auto}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.table{display:table}.h-auto{height:auto}.h-full{height:100%}.min-h-screen{min-height:100vh}.w-full{width:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.-translate-x-full{--tw-translate-x:-100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.overflow-hidden{overflow:hidden}.rounded-\[var\(--radius-large\)\]{border-radius:var(--radius-large)}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-current{border-color:currentColor}.border-t-transparent{border-top-color:#0000}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-transparent{--tw-gradient-from:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.object-cover{-o-object-fit:cover;object-fit:cover}.text-center{text-align:center}.text-right{text-align:right}.whitespace-nowrap{white-space:nowrap}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.italic{font-style:italic}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.duration-1000{--tw-duration:1s;transition-duration:1s}@media (hover:hover){.group-hover\:translate-x-full:is(:where(.group):hover *){--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\:scale-105:is(:where(.group):hover *),.hover\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x) var(--tw-scale-y)}}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.disabled\:scale-100:disabled{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}:root{--font-body:"LXGW WenKai", "Inter", "Noto Sans SC", -apple-system, system-ui, sans-serif;--font-heading:"LXGW WenKai", "DM Sans", "Noto Sans SC", -apple-system, system-ui, sans-serif;--font-friendly:"LXGW WenKai", "Noto Sans SC", system-ui, sans-serif;font-family:var(--font-body);--g:#3a8c50;--gd:#2a5c34;--gl:#edf7f0;--gb:#c2dfc9;--gm:#7aaa84;--gs:#94b89a;--acc:#e8522a;--red:#c0272d;--surf:#f4f9f5;--white:#fff;--color-primary:var(--g);--color-primary-light:#22c55e;--color-primary-dark:var(--gd);--color-primary-bg:var(--gl);--color-text-primary:#111827;--color-text-secondary:#6b7280;--color-background:var(--white);--color-surface:var(--surf);--color-accent-red:var(--red);--color-border:#e5e7eb;--topbar-h:72px;--shadow-subtle:0 1px 3px 0 #0000000f, 0 1px 2px -1px #0000000f;--shadow-medium:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-large:0 10px 15px -3px #00000014, 0 4px 6px -4px #0000000a;--radius-large:20px;--radius-medium:14px;--radius-small:8px;color-scheme:light;color:var(--color-text-primary);background-color:var(--white);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;font-weight:400;line-height:1.6}body{background-color:var(--color-background);min-width:320px;min-height:100vh;color:var(--color-text-primary);-webkit-overflow-scrolling:touch;overscroll-behavior:none;touch-action:manipulation;margin:0}*{box-sizing:border-box}#root{background-color:#fff;width:100%;min-height:100vh}.minimalist-card{background-color:var(--color-background);border-radius:var(--radius-large);box-shadow:var(--shadow-subtle);border:none;transition:all .2s}.minimalist-card:hover{box-shadow:var(--shadow-medium);transform:translateY(-2px)}.minimalist-button{font-family:var(--font-heading);background-color:var(--color-primary);color:#fff;border-radius:var(--radius-large);letter-spacing:.02em;cursor:pointer;border:none;padding:12px 24px;font-size:.9375rem;font-weight:500;transition:all .2s}.minimalist-button:hover{background-color:var(--color-primary-light);transform:translateY(-1px)}.minimalist-input{font-family:var(--font-body);background-color:var(--color-surface);border-radius:var(--radius-large);letter-spacing:.01em;border:1px solid #e5e7eb;padding:12px 16px;font-size:15px;font-weight:400;transition:all .2s}.minimalist-input:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #3a8c5026}.container{max-width:1280px;margin:0 auto;padding:0 24px}.tt-grid-5{grid-template-columns:repeat(5,1fr);gap:16px;display:grid}@media (max-width:1200px){.tt-grid-5{grid-template-columns:repeat(4,1fr)}}@media (max-width:900px){.tt-grid-5{grid-template-columns:repeat(3,1fr)}}@media (max-width:600px){.tt-grid-5{grid-template-columns:repeat(2,1fr)}}@media (max-width:400px){.tt-grid-5{grid-template-columns:1fr}}.section-spacing{margin-bottom:80px}.controlled-image{-o-object-fit:cover;object-fit:cover;border-radius:var(--radius-medium);width:100%;height:300px}.logo-header{width:auto;height:32px}.logo-small{width:auto;height:40px}.logo-medium{width:auto;height:60px}.text-display{font-family:var(--font-heading);letter-spacing:.01em;color:#1a1a2e;font-size:2.5rem;font-weight:600;line-height:1.25}.text-title{font-family:var(--font-heading);letter-spacing:.01em;color:#2d3436;font-size:1.75rem;font-weight:600;line-height:1.3}.text-subtitle{font-family:var(--font-heading);letter-spacing:.005em;color:#2d3436;font-size:1.125rem;font-weight:500;line-height:1.4}.text-body{font-family:var(--font-body);letter-spacing:.01em;color:#4a4a4a;font-size:.9375rem;font-weight:400;line-height:1.75}.text-body-sm{font-family:var(--font-body);letter-spacing:.01em;color:#636e72;font-size:.875rem;font-weight:400;line-height:1.65}.text-caption{font-family:var(--font-body);letter-spacing:.015em;color:#838e96;font-size:.8125rem;font-weight:400;line-height:1.5}.text-label{font-family:var(--font-heading);letter-spacing:.02em;color:#2d3436;font-size:.875rem;font-weight:500;line-height:1}.text-price{font-family:var(--font-heading);letter-spacing:0;color:#2a5c34;font-size:1.5rem;font-weight:600;line-height:1}.text-price-sm{font-family:var(--font-heading);letter-spacing:0;color:#2a5c34;font-size:1rem;font-weight:600;line-height:1}input,textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--radius-large);font-size:15px;font-family:var(--font-body);letter-spacing:.01em;font-weight:400}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;font-family:var(--font-heading);letter-spacing:.01em;touch-action:manipulation;background:0 0;border:none;font-weight:500}::-webkit-scrollbar{background:0 0;width:6px}::-webkit-scrollbar-track{background:var(--color-surface)}::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#9ca3af}.minimalist-button,button[type=submit],button[type=button],.primary-button,.secondary-button{transition:all .15s}.minimalist-button:hover,button[type=submit]:hover:not(:disabled),button[type=button]:hover:not(:disabled),.primary-button:hover:not(:disabled),.secondary-button:hover:not(:disabled){transform:translateY(-1px)}.minimalist-button:active,button[type=submit]:active:not(:disabled),button[type=button]:active:not(:disabled),.primary-button:active:not(:disabled),.secondary-button:active:not(:disabled){transform:translateY(0)scale(.98)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.shimmer-loading{border-radius:var(--radius-medium);background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%) 0 0/200% 100%;animation:1.5s infinite shimmer}.shimmer-text{height:1rem;margin-bottom:.5rem}.shimmer-title{width:60%;height:1.5rem;margin-bottom:1rem}.shimmer-card{width:100%;height:200px}.shimmer-avatar{border-radius:50%;width:48px;height:48px}@keyframes toast-slide-in{0%{opacity:0;transform:translate(120%)}to{opacity:1;transform:translate(0)}}@keyframes toast-slide-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(120%)}}.toast-enter{animation:.25s forwards toast-slide-in}.toast-exit{animation:.25s forwards toast-slide-out}.language-toggle{transition:opacity .2s}.language-toggle:hover{opacity:.7}@media (max-width:768px){*{-webkit-user-select:none;-moz-user-select:none;user-select:none}input,textarea{-webkit-user-select:text;-moz-user-select:text;user-select:text}.text-display{font-size:1.75rem}.text-title{font-size:1.375rem}.text-subtitle{font-size:1rem}.text-price{font-size:1.25rem}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}
:root {
  --g: #3a8c50;
  --gd: #2a5c34;
  --gl: #edf7f0;
  --gb: #c2dfc9;
  --gm: #7aaa84;
  --gs: #94b89a;
  --acc: #E8522A;
  --red: #C0272D;
  --surf: #f4f9f5;
  --white: #fff;
  --topbar-h: 72px;
}

.v8-body {
  font-family: 'Noto Sans SC', 'PingFang SC', sans-serif;
  background: var(--surf);
  min-height: 100vh;
}

.v8-device {
  width: 100%;
  background: var(--surf);
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* Desktop layout (>= 768px) */
@media (min-width: 768px) {
  .v8-body {
    background: var(--surf);
  }
  
  .v8-device {
    max-width: 1200px;
    margin: 0 auto;
  }
}

/* ══ FIXED TOP BAR ══ */
.v8-topbar {
  position: sticky;
  top: 0;
  height: var(--topbar-h);
  background: white;
  border-bottom: 1px solid #e8f0ea;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 14px;
  z-index: 100;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.07);
}

@media (min-width: 768px) {
  .v8-topbar {
    padding: 0 32px;
  }
}

.v8-topbar-left,
.v8-topbar-right {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.v8-topbar-right {
  align-items: flex-end;
  text-align: right;
}

.v8-tb-label {
  font-size: 8px;
  color: #bbb;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 2px;
}

.v8-tb-row {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 9.5px;
  color: #888;
  line-height: 1.4;
}

.v8-topbar-right .v8-tb-row {
  justify-content: flex-end;
}

.v8-open-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4caf50;
  flex-shrink: 0;
  box-shadow: 0 0 5px rgba(76, 175, 80, 0.55);
}

.v8-topbar-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
}

.v8-topbar-logo img {
  height: 50px;
  width: auto;
}

/* ══ SCROLL BODY ══ */
.v8-scroll-body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
}

.v8-scroll-body::-webkit-scrollbar {
  display: none;
}

@media (min-width: 768px) {
  .v8-scroll-body {
    padding-bottom: 64px;
  }
}

/* ══ HERO BANNER ══ */
.v8-hero {
  position: relative;
  height: 186px;
  overflow: hidden;
  flex-shrink: 0;
}

.v8-hero-bg {
  position: absolute;
  inset: -14px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="200"><rect fill="%232a5c34" width="400" height="200"/></svg>');
  background-size: cover;
  background-position: center;
  filter: brightness(0.7);
}

.v8-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.45) 100%);
}

.v8-hero-carousel-hint {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 2;
}

.v8-carousel-dots {
  display: flex;
  gap: 5px;
}

.v8-carousel-dots span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transition: all 0.3s ease;
}

.v8-carousel-dots span.active {
  width: 14px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.9);
}

.v8-hero-content {
  position: absolute;
  bottom: 16px;
  left: 16px;
  right: 16px;
  z-index: 2;
  color: white;
}

.v8-hero-tagline {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  opacity: 0.85;
  margin-bottom: 4px;
}

.v8-hero-title-row {
  margin-bottom: 10px;
}

.v8-hero-headline {
  font-family: 'Noto Serif SC', serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 2px;
}

.v8-hero-headline em {
  font-style: italic;
  font-family: 'Playfair Display', serif;
}

.v8-hero-sub-en {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.05em;
  opacity: 0.8;
}

.v8-hero-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.v8-hero-pill {
  font-size: 9.5px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 10px;
  backdrop-filter: blur(4px);
  border: 0.5px solid rgba(255, 255, 255, 0.25);
}

/* ══ TICKER ══ */
.v8-ticker-wrap {
  background: var(--red);
  color: white;
  overflow: hidden;
  height: 28px;
  display: flex;
  align-items: center;
}

.v8-ticker-inner {
  display: flex;
  animation: v8-scroll 25s linear infinite;
  white-space: nowrap;
}

@keyframes v8-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.v8-ticker-item {
  font-size: 11px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
}

.v8-tsep {
  margin: 0 8px;
  opacity: 0.5;
}

/* ══ NAV TABS ══ */
.v8-nav-tabs {
  display: flex;
  background: white;
  border-bottom: 1px solid #e8f0ea;
  position: sticky;
  top: 0;
  z-index: 10;
}

@media (min-width: 768px) {
  .v8-nav-tabs {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
  }
}

.v8-nav-tab {
  flex: 1;
  text-align: center;
  padding: 12px 8px;
  font-size: 13px;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  position: relative;
  transition: color 0.2s;
}

.v8-nav-tab:hover {
  color: var(--g);
}

.v8-nav-tab.active {
  color: var(--g);
  font-weight: 600;
}

.v8-nav-tab.active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 20%;
  right: 20%;
  height: 3px;
  background: var(--g);
  border-radius: 2px 2px 0 0;
}

/* ══ PAGES ══ */
.v8-page {
  display: none;
  padding-bottom: 80px;
}

.v8-page.active {
  display: block;
}

@media (min-width: 768px) {
  .v8-page {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 32px;
    padding-right: 32px;
    padding-bottom: 40px;
  }
}

/* ══ REGISTRATION BANNER ══ */
.v8-reg-banner {
  background: linear-gradient(135deg, var(--g) 0%, var(--gm) 100%);
  margin: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(58, 140, 80, 0.2);
}

.v8-reg-bar {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--acc);
}

.v8-reg-title {
  font-size: 14px;
  font-weight: 600;
  color: white;
  margin-bottom: 3px;
}

.v8-reg-sub {
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.3;
}

.v8-reg-btn {
  background: white;
  color: var(--g);
  border: none;
  padding: 8px 18px;
  border-radius: 18px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ══ SECTION HEADER ══ */
.v8-sec-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 16px 12px;
}

.v8-sec-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gd);
}

.v8-sec-more {
  font-size: 12px;
  color: var(--g);
  cursor: pointer;
}

/* ══ DEALS GRID ══ */
.v8-deals-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 0 16px 16px;
}

@media (min-width: 768px) {
  .v8-deals-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    padding: 0 0 16px;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .v8-deals-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.v8-deal-card {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.v8-deal-img {
  position: relative;
  background: var(--gl);
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
}

.v8-deal-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  background: var(--red);
  color: white;
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 10px;
}

.v8-deal-pts {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: var(--g);
  color: white;
  font-size: 9px;
  padding: 3px 7px;
  border-radius: 8px;
}

.v8-deal-info {
  padding: 10px;
}

.v8-deal-name {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin-bottom: 2px;
}

.v8-deal-en {
  font-size: 10px;
  color: #999;
  margin-bottom: 6px;
}

.v8-deal-price {
  font-size: 18px;
  font-weight: 700;
  color: var(--red);
}

.v8-deal-price sup {
  font-size: 11px;
  font-weight: 600;
}

.v8-deal-orig {
  font-size: 11px;
  color: #999;
  text-decoration: line-through;
  margin-left: 4px;
}

/* ══ WECHAT BANNER ══ */
.v8-wc-banner {
  background: white;
  margin: 0 16px 16px;
  padding: 14px 16px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.v8-wc-inner {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

.v8-wc-bar {
  width: 4px;
  height: 40px;
  background: var(--g);
  border-radius: 2px;
}

.v8-wc-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--gd);
  margin-bottom: 3px;
}

.v8-wc-sub {
  font-size: 10.5px;
  color: #666;
}

.v8-wc-btn {
  background: var(--g);
  color: white;
  border: none;
  padding: 8px 18px;
  border-radius: 18px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
}

/* ══ RECIPE LIST ══ */
.v8-recipe-list {
  padding: 0 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.v8-recipe-card {
  background: white;
  padding: 14px;
  border-radius: 12px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.v8-recipe-icon {
  font-size: 32px;
  flex-shrink: 0;
}

.v8-recipe-name {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  margin-bottom: 3px;
}

.v8-recipe-en {
  font-size: 11px;
  color: #999;
  margin-bottom: 6px;
}

.v8-recipe-tags {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.v8-r-tag {
  font-size: 9.5px;
  padding: 3px 7px;
  background: var(--gl);
  color: var(--gd);
  border-radius: 8px;
}

.v8-r-tag.hot {
  background: var(--g);
  color: white;
}

/* ══ MEMBER PAGE ══ */
.v8-pts-card {
  background: var(--gl);
  margin: 16px;
  padding: 16px;
  border-radius: 14px;
  border: 0.5px solid var(--gb);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.v8-pts-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--gd);
  margin-bottom: 6px;
}

.v8-tier-badge {
  display: inline-block;
  font-size: 11px;
  padding: 4px 10px;
  background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
  color: #8b6914;
  border-radius: 10px;
  font-weight: 600;
  margin-bottom: 4px;
}

.v8-pts-num {
  font-size: 40px;
  font-weight: 700;
  color: var(--g);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.v8-progress-wrap {
  margin: 0 16px 16px;
}

.v8-progress-label {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--gm);
  margin-bottom: 6px;
}

.v8-progress-bar {
  height: 8px;
  background: rgba(255, 255, 255, 0.55);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.v8-progress-fill {
  height: 100%;
  width: 77%;
  background: var(--g);
  border-radius: 4px;
  position: relative;
}

.v8-progress-fill::after {
  content: '';
  position: absolute;
  right: -4px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background: var(--acc);
  border-radius: 50%;
  box-shadow: 0 0 0 2px white;
}

.v8-stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 0 16px 16px;
}

.v8-stat-card {
  background: white;
  padding: 12px;
  border-radius: 10px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.v8-stat-val {
  font-size: 20px;
  font-weight: 700;
  color: var(--gd);
  margin-bottom: 4px;
}

.v8-stat-label {
  font-size: 10px;
  color: #999;
}

.v8-history-list {
  padding: 0 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.v8-history-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: white;
  padding: 12px;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.v8-h-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.v8-h-dot.earn {
  background: #4a8a52;
}

.v8-h-dot.spend {
  background: #c8a248;
}

.v8-h-action {
  font-size: 13px;
  color: #333;
  margin-bottom: 2px;
}

.v8-h-date {
  font-size: 10px;
  color: #999;
}

.v8-h-pts {
  font-size: 15px;
  font-weight: 600;
  flex-shrink: 0;
}

.v8-h-pts.earn {
  color: #4a8a52;
}

.v8-h-pts.spend {
  color: #c8a248;
}

/* ══ WECHAT PAGE ══ */
.v8-post-card {
  background: white;
  padding: 14px;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.v8-post-head {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.v8-post-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--gl);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.v8-post-author {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin-bottom: 2px;
}

.v8-post-meta {
  font-size: 10px;
  color: #999;
}

.v8-post-body {
  font-size: 13px;
  color: #555;
  line-height: 1.5;
}

.v8-notice-card {
  background: linear-gradient(135deg, #fff9e6 0%, #fff4d6 100%);
  padding: 14px;
  border-radius: 12px;
  border-left: 4px solid var(--acc);
}

.v8-notice-label {
  font-size: 10px;
  color: var(--acc);
  font-weight: 600;
  margin-bottom: 4px;
}

.v8-notice-title {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  margin-bottom: 6px;
}

.v8-notice-body {
  font-size: 12px;
  color: #666;
  line-height: 1.5;
}

/* ══ BOTTOM NAVIGATION ══ */
.v8-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  border-top: 1px solid #e8f0ea;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 8px 0;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
}

@media (min-width: 768px) {
  .v8-bottom-nav {
    display: none;
  }
}

.v8-bn-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  padding: 4px;
  transition: all 0.2s;
}

.v8-bn-icon {
  font-size: 22px;
  filter: grayscale(1);
  opacity: 0.6;
  transition: all 0.2s;
}

.v8-bn-label {
  font-size: 10px;
  color: #999;
  transition: all 0.2s;
}

.v8-bn-item.active .v8-bn-icon {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.1);
}

.v8-bn-item.active .v8-bn-label {
  color: var(--g);
  font-weight: 600;
}

/* Mobile full screen (< 768px) */
@media (max-width: 767px) {
  .v8-body {
    padding: 0;
  }

  .v8-device {
    border-radius: 0;
    min-height: 100vh;
  }

  .v8-scroll-body {
    border-radius: 0;
  }

  .v8-bottom-nav {
    border-radius: 0;
  }
}