  .gwrap { position:relative; display:inline-block; width:172px; height:40px; flex:none; cursor:pointer;
    user-select:none; -webkit-tap-highlight-color:transparent; text-decoration:none; line-height:normal; }
  .gwrap:focus-visible { outline:2px solid var(--ink); outline-offset:3px; border-radius:999px; }
  .hapsw { position:fixed; top:0; left:0; width:1px; height:1px; opacity:0; pointer-events:none; }
  .gskin { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:8px;
    background:var(--ink); color:#fff; font-size:13px; font-weight:700; border-radius:999px;
    transition:box-shadow .15s ease; }
  .gskin svg { width:17px; height:17px; flex:none; }
  .gwrap:hover .gskin, .gwrap:active .gskin { box-shadow:0 0 0 2px var(--brand) inset; }    
  .gwrap.dormant { cursor:default; }
  .gwrap.dormant .gskin { opacity:.45; }

  body.auth-pending .gwrap, html.auth-pending .gwrap { visibility:hidden; }
  .gwrap.member { width:auto; }
  .gwrap.member .gskin { position:static; height:40px; padding:0 18px 0 9px; }
  .gwrap.member .gskin img { width:26px; height:26px; border-radius:50%; flex:none; }
  .acct-menu, .ws-checkout-host .modal-overlay { line-height:normal; }
  .member-ava-ph { width:26px; height:26px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; color:#0A0A0A; font-weight:700; font-size:12px; }
  .member-name { max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .member-plan { background:#18181B; color:#0A0A0A; font-weight:800; font-size:11px; border-radius:999px; padding:2px 8px; margin-left:2px; letter-spacing:.04em; }
  .member-plan.admin { background:#0A0A0A; color:#18181B; font-size:9px; padding:2px 5px; letter-spacing:.02em; }
  .acct-skel { position:fixed; z-index:129; width:300px; box-sizing:border-box; padding:.9rem;
    background:var(--card); border:1px solid var(--border); border-radius:12px;
    box-shadow:0 14px 36px rgba(10,10,10,.16); display:grid; gap:.62rem; }
  .acct-skel i { display:block; height:15px; border-radius:6px;
    background:linear-gradient(100deg,#F1EFE9 40%,#fff 50%,#F1EFE9 60%); background-size:200% 100%;
    animation:acctSkel 1.4s linear infinite; }
  .acct-skel i:nth-child(1) { width:72%; }
  .acct-skel i:nth-child(2) { width:88%; }
  .acct-skel i:nth-child(3) { width:56%; }
  @keyframes acctSkel { from { background-position:120% 0; } to { background-position:-20% 0; } }
  @media (prefers-reduced-motion:reduce) { .acct-skel i { animation:none; }
}
  @media (max-width:640px) { .acct-skel { left:6px; right:6px; width:auto; }
    .member-name { max-width:96px; }
}

  .nav { position:sticky; top:6px; z-index:150; margin:6px clamp(10px,1.4vw,16px) 0;
    background:var(--card); border:1px solid var(--border); border-radius:clamp(14px,1.6vw,20px);
    padding:5px clamp(18px,3.6vw,36px); display:flex; align-items:center; flex-wrap:wrap; row-gap:8px; box-sizing:border-box;
    transition:transform .38s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion:reduce) { .nav { transition:none; }
}
  .nav .wm { font-size:18px; transform-origin:left center; }
  .nav-links { display:flex; align-items:center; gap:clamp(14px,2.4vw,26px); flex-wrap:wrap; row-gap:6px; margin-left:auto; }
  .nav-links a { font-size:14px; color:var(--ink); font-weight:600; text-decoration:none; text-underline-offset:6px; }
  .nav-links a:hover { color:var(--ink); text-decoration:underline; text-decoration-color:var(--brand); text-decoration-thickness:2px; }
  .nav-links a.is-cur { text-decoration:underline; text-decoration-color:var(--brand); text-decoration-thickness:2px; }
  .nav-side { display:flex; align-items:center; gap:8px; margin-left:clamp(14px,2.4vw,26px); }
  .nav-menu-btn { display:none; width:40px; height:40px; flex:none; align-items:center; justify-content:center;
    background:rgba(255,255,255,.44); border:1px solid rgba(255,255,255,.6); border-radius:999px; cursor:pointer; padding:0; }
  .nav-menu-btn svg { width:18px; height:18px; fill:var(--ink); }
  .nav-menu-btn rect { transform-box:fill-box; transform-origin:center; transition:transform .22s cubic-bezier(.3,.7,.3,1.2); }
  .nav-menu-btn .l2 { transform:scaleX(.62); }
  .nav.menu-open .nav-menu-btn .l1 { transform:translateY(2px) rotate(45deg); }
  .nav.menu-open .nav-menu-btn .l2 { transform:translateY(-2px) rotate(-45deg) scaleX(1); }
  .nav-scrim { position:fixed; inset:0; z-index:149; display:none; }
  .nav-scrim.on { display:block; }
@media (min-width:641px) { .nav-scrim { display:none !important; }
}
@media (max-width:640px) {
    .nav { margin:6px 10px 0; padding:5px 8px 5px 12px; border-radius:14px; }
    .nav .wm { display:inline-block; font-size:15px; padding:12.5px 0; }
    .nav-links { display:flex; position:absolute; top:calc(100% + 8px); left:0; right:0; margin-left:0;
      flex-direction:column; align-items:stretch; gap:2px; padding:8px;
      background:var(--card); border:1px solid var(--border); border-radius:16px;
      box-shadow:0 14px 36px rgba(10,10,10,.16);
      opacity:0; transform:translateY(-6px) scale(.98); transform-origin:top center; pointer-events:none;
      transition:opacity .22s ease, transform .3s cubic-bezier(.2,.9,.3,1.06); }
    .nav.menu-open .nav-links { opacity:1; transform:none; pointer-events:auto; }
    .nav-links a { font-size:15px; padding:12px 14px; border-radius:10px;
      opacity:0; transform:translateY(-5px); transition:opacity .22s ease, transform .22s ease; }
    .nav.menu-open .nav-links a { opacity:1; transform:none; }
    .nav.menu-open .nav-links a:nth-child(1) { transition-delay:.04s; }
    .nav.menu-open .nav-links a:nth-child(2) { transition-delay:.08s; }
    .nav.menu-open .nav-links a:nth-child(3) { transition-delay:.12s; }
    .nav.menu-open .nav-links a:nth-child(4) { transition-delay:.16s; }
    .nav-links a:hover, .nav-links a:active { background:var(--bg); text-decoration:none; }
    .nav-side { margin-left:auto; }
    .nav-menu-btn { display:inline-flex; }
}


:root { --glass-tail: brightness(.98) blur(1px); }
:root[data-theme="dark"] { --glass-tail: brightness(1.1) blur(1px); }

:root { --edge-tint: 20%;
  --edge-fade-down: linear-gradient(to bottom,
    color-mix(in srgb, var(--bg) var(--edge-tint), transparent) 0,
    color-mix(in srgb, var(--bg) var(--edge-tint), transparent) calc(100% - 16px), transparent 100%);
  --edge-fade-up: linear-gradient(to top,
    color-mix(in srgb, var(--bg) var(--edge-tint), transparent) 0,
    color-mix(in srgb, var(--bg) var(--edge-tint), transparent) calc(100% - 18px), transparent 100%); }

.tb-glass.tb-glass { position: relative; background: transparent; border-color: transparent;
  box-shadow:
    0 0 0 1px rgba(10,10,10,.06),
    inset 0 0 0 1.2px rgba(255,255,255,.45),
    inset 0 1.5px 0 rgba(255,255,255,.65),
    inset 0 -1px 0 rgba(255,255,255,.30),
    inset 1px 0 0 rgba(255,255,255,.34),
    inset -1px 0 0 rgba(255,255,255,.34),
    inset 0 0 14px rgba(255,255,255,.14); }
.tb-glass.tb-glass::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.26) 0%, rgba(255,255,255,0) 34%,
    rgba(255,255,255,0) 66%, rgba(255,255,255,.16) 100%); }
.tb-glass.tb-glass.glass-frost { -webkit-backdrop-filter: saturate(1.35) var(--glass-tail); backdrop-filter: saturate(1.35) var(--glass-tail); }

:root[data-theme="dark"] .tb-glass.tb-glass { background: transparent; box-shadow: 0 0 0 1px rgba(0,0,0,.55); }
:root[data-theme="dark"] .tb-glass.tb-glass::after { background: none; }

@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .tb-glass.tb-glass { background: var(--bg) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  .tb-glass.tb-glass::after { background: none !important; }
}
@media (prefers-contrast: more) {
  .tb-glass.tb-glass { box-shadow: 0 0 0 1px var(--dim) !important; }
}

.nav.tb-glass.tb-glass { position: sticky; }
.nav.tb-glass { border-radius: 999px; }
.nav.menu-open { border-radius: 20px; }
.nav.tb-glass::before { content:''; position:absolute; z-index:-1; pointer-events:none;
  inset:-6px calc(-1 * clamp(10px,1.4vw,16px)) -6px; background:var(--edge-fade-down);
  opacity:0; transition:opacity .18s ease; }
html.edge-top .nav.tb-glass::before { opacity:1; }
@media (prefers-reduced-motion:reduce) { .nav.tb-glass::before { transition:none; } }
@media (max-width:640px) { .nav.tb-glass::before { inset:-6px -10px -6px; } }




/* === ICANSTron Corp. (安康司創有限公司) Monochrome Architectural Theme === */
:root {
  --brand: #0A0A0A !important;
  --bg: #FAFAFA !important;
  --card: #FFFFFF !important;
  --border: #E4E4E7 !important;
  --text: #09090B !important;
  --dim: #71717A !important;
}
:root[data-theme=dark] {
  --brand: #FAFAFA !important;
  --bg: #09090B !important;
  --card: #121215 !important;
  --border: #27272A !important;
  --text: #FAFAFA !important;
  --dim: #A1A1AA !important;
}
.wm { display: inline-flex !important; align-items: center !important; vertical-align: middle; line-height: 1; }
.wm .icanstron-logo { height: 22px; width: auto; display: block; object-fit: contain; pointer-events: none; user-select: none; }
.wm.wm-sm .icanstron-logo { height: 20px; }
.wall .wm .icanstron-logo { height: 34px !important; }
:root[data-theme=dark] .wm:not(.ph-wm) .icanstron-logo { filter: invert(1) brightness(2); }
:root:not([data-theme=dark]) :is(.btn.brand, .tp-play, .wf-tog.on, .chat-send, .entry-pick, .btn.lang-fix, .toast-act-btn) {
  background: #0A0A0A !important;
  color: #FAFAFA !important;
  border-color: #0A0A0A !important;
}
:root[data-theme=dark] :is(.btn.brand, .tp-play, .wf-tog.on, .chat-send, .entry-pick, .btn.lang-fix, .toast-act-btn) {
  background: #FAFAFA !important;
  color: #0A0A0A !important;
  border-color: #FAFAFA !important;
}
.plan-pill {
  background: #18181B !important;
  color: #FAFAFA !important;
  border: 1px solid #3F3F46 !important;
}
