/* V149 — restrained restaurant/editorial navigation.
   Complete replacement for V145/V146/V147 header + mobile-menu styles.
   Existing IDs, data attributes, links, router and native dialog are retained. */
:root{--v149-nav-bg:#151715;--v149-nav-fg:#fafaf7;--v149-nav-soft:#aeb4ac;--v149-nav-rule:#ffffff22;--v149-nav-accent:#06c167;--v149-nav-font:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif}

.joanne-site #site-header-v145,header.seo-header.v145-seo-header{
 position:sticky!important;top:0!important;z-index:1100!important;margin:0!important;
 border:0!important;border-bottom:1px solid var(--v149-nav-rule)!important;
 background:var(--v149-nav-bg)!important;color:var(--v149-nav-fg)!important;
 box-shadow:none!important;backdrop-filter:none!important;visibility:visible!important;opacity:1!important;
}
.joanne-site #site-header-v145.is-scrolled{box-shadow:0 5px 18px #00000012!important}
.joanne-site #site-header-v145 .v145-header-inner,header.seo-header.v145-seo-header .seo-header-inner{
 box-sizing:border-box;display:flex!important;align-items:center!important;justify-content:space-between!important;
 flex-wrap:nowrap!important;gap:28px!important;width:calc(100% - 88px)!important;max-width:1440px!important;
 min-height:75px!important;height:auto!important;margin:0 auto!important;padding:12px 0!important;
}

/* A quiet wordmark uses the existing accessible brand link. */
.joanne-site #site-header-v145 .v145-brand,header.seo-header.v145-seo-header .brand{
 display:inline-flex!important;align-items:center!important;flex:0 0 auto!important;gap:17px!important;
 min-width:0;margin:0!important;color:var(--v149-nav-fg)!important;text-decoration:none!important;text-shadow:none!important;
}
.joanne-site #site-header-v145 .v145-brand:before,header.seo-header.v145-seo-header .brand:before{
 content:"Joanne";display:block;flex:0 0 auto;color:inherit;
 font:650 23px/1.2 Arial,Helvetica,sans-serif;letter-spacing:-.045em;
}
.joanne-site #site-header-v145 .v145-mark,header.seo-header.v145-seo-header .brand-icon.v145-seo-mark,
.joanne-site #site-header-v145 .v145-brand-text strong,header.seo-header.v145-seo-header .brand-text strong{display:none!important}
.joanne-site #site-header-v145 .v145-brand-text,header.seo-header.v145-seo-header .brand-text{display:block!important;min-width:0}
.joanne-site #site-header-v145 .v145-brand-text>span,header.seo-header.v145-seo-header .brand-text>span{
 display:block!important;color:var(--v149-nav-soft)!important;
 font:400 10px/1.6 var(--v149-nav-font)!important;letter-spacing:.02em!important;white-space:nowrap;
}
.joanne-site #site-header-v145 .v145-nav,header.seo-header.v145-seo-header nav{
 display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
 flex-wrap:nowrap!important;order:0!important;width:auto!important;gap:26px!important;margin:0 0 0 auto!important;
 padding:0!important;border:0!important;overflow:visible!important;
}
.joanne-site #site-header-v145 .v145-nav a,header.seo-header.v145-seo-header nav a{
 position:relative;display:inline-flex;align-items:center;min-height:44px!important;margin:0!important;padding:11px 0!important;
 border:0!important;background:transparent!important;color:#e5e8e2!important;text-decoration:none!important;opacity:1!important;
 font:400 12px/1.6 var(--v149-nav-font)!important;letter-spacing:.025em!important;white-space:nowrap;
}
.joanne-site #site-header-v145 .v145-nav a:before,header.seo-header.v145-seo-header nav a:before{content:none}
.joanne-site #site-header-v145 .v145-nav a:after,header.seo-header.v145-seo-header nav a:after{
 content:"";position:absolute;inset:auto 0 5px;display:block;height:1px;background:var(--v149-nav-accent);
 transform:scaleX(0);transform-origin:left;transition:transform .2s ease;
}
.joanne-site #site-header-v145 .v145-nav a:hover:after,.joanne-site #site-header-v145 .v145-nav a[aria-current="page"]:after,
header.seo-header.v145-seo-header nav a:hover:after,header.seo-header.v145-seo-header nav a[aria-current="page"]:after{transform:scaleX(1)}
.joanne-site #site-header-v145 .v145-nav a:hover,header.seo-header.v145-seo-header nav a:hover{color:#fff!important}
.joanne-site #site-header-v145 .v145-header-actions,header.seo-header.v145-seo-header .seo-header-actions{
 display:flex!important;align-items:center!important;flex:0 0 auto!important;order:0!important;gap:10px!important;
 width:auto!important;margin:0 0 0 5px!important;
}
.joanne-site #site-header-v145 .v145-header-apply,header.seo-header.v145-seo-header .seo-header-actions .seo-apply{
 box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;
 gap:15px!important;min-height:44px!important;margin:0!important;padding:11px 20px!important;
 border:1px solid var(--v149-nav-fg)!important;border-radius:999px!important;background:var(--v149-nav-fg)!important;
 color:#151715!important;box-shadow:none!important;filter:none!important;text-decoration:none!important;white-space:nowrap;
 font:550 12px/1.6 var(--v149-nav-font)!important;letter-spacing:.02em!important;transition:background .2s ease!important;
}
.joanne-site #site-header-v145 .v145-header-apply:before,.joanne-site #site-header-v145 .v145-header-apply:after,
header.seo-header.v145-seo-header .seo-header-actions .seo-apply:before,header.seo-header.v145-seo-header .seo-header-actions .seo-apply:after{content:none!important;display:none!important}
.joanne-site #site-header-v145 .v145-header-apply:hover,header.seo-header.v145-seo-header .seo-header-actions .seo-apply:hover{background:#e5ebe2!important;border-color:#e5ebe2!important;transform:none!important}
.joanne-site #site-header-v145 .v145-header-apply svg,header.seo-header.v145-seo-header .seo-apply svg{width:16px!important;height:16px!important;color:inherit!important;stroke-width:1.5}
header.seo-header.v145-seo-header .seo-header-actions .seo-contact{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;gap:9px!important;
 min-height:44px!important;margin:0!important;padding:10px 14px!important;border:0!important;border-radius:999px!important;
 background:transparent!important;color:#e5e8e2!important;font:400 12px/1.6 var(--v149-nav-font)!important;
 text-decoration:none!important;box-shadow:none!important;filter:none!important;
}
header.seo-header.v145-seo-header .seo-contact svg{width:15px!important;height:15px!important}
header.seo-header.v145-seo-header .seo-header-actions .seo-contact:hover{background:#ffffff0b!important}

/* A labelled 44px control; no dependence on hidden or tiny SVGs. */
.joanne-site #site-header-v145 .v145-menu,header.seo-header.v145-seo-header .seo-menu-toggle{
 box-sizing:border-box!important;position:relative!important;display:none!important;align-items:center!important;justify-content:center!important;
 flex:0 0 78px!important;width:78px!important;height:44px!important;min-width:78px!important;min-height:44px!important;
 margin:0!important;padding:0!important;border:1px solid #ffffff42!important;border-radius:999px!important;
 background:transparent!important;color:var(--v149-nav-fg)!important;box-shadow:none!important;cursor:pointer;
}
.joanne-site #site-header-v145 .v145-menu svg,header.seo-header.v145-seo-header .seo-menu-toggle svg{display:none!important}
.joanne-site #site-header-v145 .v145-menu:before,header.seo-header.v145-seo-header .seo-menu-toggle:before{
 content:""!important;position:absolute!important;inset:auto!important;left:13px!important;right:auto!important;top:50%!important;
 display:block!important;width:16px!important;height:1px!important;border:0!important;background:currentColor!important;
 box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor!important;opacity:1!important;transform:translateY(-50%)!important;
}
.joanne-site #site-header-v145 .v145-menu:after,header.seo-header.v145-seo-header .seo-menu-toggle:after{
 content:"選單"!important;position:absolute!important;inset:auto!important;left:37px!important;right:auto!important;top:50%!important;
 display:block!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;
 background:transparent!important;color:inherit!important;box-shadow:none!important;opacity:1!important;transform:translateY(-50%)!important;
 font:400 10px/1.5 var(--v149-nav-font)!important;letter-spacing:.02em!important;white-space:nowrap;
}
.joanne-site #site-header-v145 .v145-menu[aria-expanded="true"]:after,header.seo-header.v145-seo-header .seo-menu-toggle[aria-expanded="true"]:after{content:"關閉"!important}
.joanne-site #site-header-v145 .v145-menu:hover,header.seo-header.v145-seo-header .seo-menu-toggle:hover{background:#ffffff09!important}

/* Native <dialog> owns focus and Escape; existing code owns scroll locking. */
.joanne-site #mobile-menu{
 box-sizing:border-box!important;inset:0 0 0 auto!important;width:min(500px,100vw)!important;max-width:100vw!important;
 height:100dvh!important;max-height:100dvh!important;min-height:0!important;margin:0 0 0 auto!important;
 padding:max(26px,env(safe-area-inset-top)) 34px max(28px,env(safe-area-inset-bottom))!important;
 border:0!important;border-radius:0!important;background:var(--v149-nav-bg)!important;color:var(--v149-nav-fg)!important;
 font-family:var(--v149-nav-font)!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;scrollbar-width:thin;
}
.joanne-site #mobile-menu:not([open]){display:none!important}
.joanne-site #mobile-menu[open]{display:flex!important;flex-direction:column!important}
.joanne-site #mobile-menu::backdrop{background:#0009;backdrop-filter:blur(7px)}
.joanne-site #mobile-menu .mobile-dialog-header{
 display:flex!important;align-items:center!important;justify-content:space-between!important;flex-shrink:0;gap:20px;
 padding:0 0 25px!important;border-bottom:1px solid var(--v149-nav-rule)!important;
}
.joanne-site #mobile-menu .mobile-dialog-header h2{
 display:flex;flex-direction:column;gap:7px;margin:0!important;color:var(--v149-nav-soft)!important;
 font:400 10px/1.5 var(--v149-nav-font)!important;letter-spacing:.08em!important;
}
.joanne-site #mobile-menu .mobile-dialog-header h2:before{
 content:"Joanne";display:block;color:var(--v149-nav-fg);font:650 26px/1.1 Arial,Helvetica,sans-serif;letter-spacing:-.045em;
}
.joanne-site #mobile-menu [data-menu-close]{
 display:grid!important;place-items:center!important;flex:0 0 44px!important;box-sizing:border-box!important;
 width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;margin:0!important;padding:0!important;
 border:1px solid #ffffff42!important;border-radius:50%!important;background:transparent!important;color:var(--v149-nav-fg)!important;box-shadow:none!important;
}
.joanne-site #mobile-menu [data-menu-close] svg{width:20px!important;height:20px!important;stroke-width:1.3}
.joanne-site #mobile-menu [data-menu-close]:hover{background:#ffffff09!important}
.joanne-site #mobile-menu nav{display:flex!important;flex-direction:column!important;flex-shrink:0;margin:27px 0 34px!important;padding:0!important;counter-reset:v149-menu-items}
.joanne-site #mobile-menu nav a{
 display:grid!important;grid-template-columns:26px 1fr 20px!important;align-items:center!important;column-gap:15px!important;
 counter-increment:v149-menu-items;min-height:66px!important;margin:0!important;padding:15px 0!important;
 border:0!important;border-bottom:1px solid var(--v149-nav-rule)!important;border-radius:0!important;
 background:transparent!important;color:var(--v149-nav-fg)!important;text-decoration:none!important;
 font:400 27px/1.3 var(--v149-nav-font)!important;letter-spacing:.035em!important;
}
.joanne-site #mobile-menu nav a:before{
 content:counter(v149-menu-items,decimal-leading-zero);grid-column:1;align-self:center;color:#808b7f;
 font:400 10px/1.5 Arial,sans-serif;letter-spacing:.04em;
}
.joanne-site #mobile-menu nav a:after{content:none!important;display:none!important}
.joanne-site #mobile-menu nav a svg{grid-column:3;justify-self:end;width:18px!important;height:18px!important;color:#b8c0b5;opacity:1!important;stroke-width:1.15}
.joanne-site #mobile-menu nav a.current,.joanne-site #mobile-menu nav a[aria-current="page"]{font-weight:400!important}
.joanne-site #mobile-menu nav a.current:before,.joanne-site #mobile-menu nav a[aria-current="page"]:before{color:var(--v149-nav-accent)}
.joanne-site #mobile-menu nav a:hover svg{transform:translateX(3px);color:#fff}
.joanne-site #mobile-menu .mobile-dialog-bottom{display:flex!important;flex-direction:column!important;flex-shrink:0;gap:12px!important;margin:auto 0 0!important;padding:0!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn{
 display:flex!important;align-items:center!important;justify-content:center!important;gap:16px!important;
 min-height:53px!important;margin:0!important;padding:14px 20px!important;border:1px solid #ffffff42!important;border-radius:999px!important;
 box-shadow:none!important;text-decoration:none!important;font:500 13px/1.6 var(--v149-nav-font)!important;letter-spacing:.025em!important;transform:none!important;
}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn:before,.joanne-site #mobile-menu .mobile-dialog-bottom .btn:after{content:none!important;display:none!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary{justify-content:space-between!important;background:var(--v149-nav-fg)!important;color:#151715!important;border-color:var(--v149-nav-fg)!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary svg{width:19px!important;height:19px!important;stroke-width:1.4}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-outline{min-height:47px!important;background:transparent!important;color:var(--v149-nav-fg)!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary:hover{background:#e5ebe2!important;border-color:#e5ebe2!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-outline:hover{background:#ffffff09!important}
.joanne-site #mobile-menu .mobile-dialog-bottom p{margin:8px 0 0!important;color:#909d8e!important;font:400 10px/1.9 var(--v149-nav-font)!important;letter-spacing:.01em!important}
.joanne-site #mobile-menu .mobile-dialog-bottom p a{display:inline;color:#aeb9a8;text-decoration:underline;text-underline-offset:3px;margin-left:5px}
.joanne-site #site-header-v145 a:focus-visible,.joanne-site #site-header-v145 button:focus-visible,
header.seo-header.v145-seo-header a:focus-visible,header.seo-header.v145-seo-header button:focus-visible,
.joanne-site #mobile-menu a:focus-visible,.joanne-site #mobile-menu button:focus-visible{outline:2px solid var(--v149-nav-accent)!important;outline-offset:4px!important}

@media(max-width:1200px){
 .joanne-site #site-header-v145 .v145-header-inner,header.seo-header.v145-seo-header .seo-header-inner{width:calc(100% - 64px)!important;gap:23px!important}
 .joanne-site #site-header-v145 .v145-brand-text,header.seo-header.v145-seo-header .brand-text{display:none!important}
}
@media(max-width:1050px){
 .joanne-site #site-header-v145 .v145-nav{display:none!important}
 .joanne-site #site-header-v145 .v145-menu,header.seo-header.v145-seo-header .seo-menu-toggle{display:inline-flex!important}
 .joanne-site #site-header-v145 .v145-header-actions{margin-left:auto!important}
 header.seo-header.v145-seo-header .seo-header-inner{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;grid-template-areas:"brand actions menu" "nav nav nav"!important;
  column-gap:12px!important;row-gap:0!important;
 }
 header.seo-header.v145-seo-header .brand{grid-area:brand}
 header.seo-header.v145-seo-header .seo-header-actions{grid-area:actions;margin:0!important}
 header.seo-header.v145-seo-header .seo-menu-toggle{grid-area:menu}
 header.seo-header.v145-seo-header nav{
  grid-area:nav;display:none!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;
  gap:0!important;margin:0!important;padding:0!important;border:0!important;max-height:calc(100dvh - 114px);overflow-y:auto!important;
  overscroll-behavior:contain;counter-reset:v149-seo-items;
 }
 header.seo-header.v145-seo-header.menu-open nav{display:flex!important;margin-top:16px!important;padding:8px 0 4px!important;border-top:1px solid var(--v149-nav-rule)!important}
 header.seo-header.v145-seo-header nav a{display:flex!important;gap:15px!important;counter-increment:v149-seo-items;min-height:55px!important;padding:13px 2px!important;border-bottom:1px solid var(--v149-nav-rule)!important;font-size:19px!important}
 header.seo-header.v145-seo-header nav a:before{content:counter(v149-seo-items,decimal-leading-zero);flex:0 0 26px;color:#91a08b;font:400 10px/1.5 Arial,sans-serif}
 header.seo-header.v145-seo-header nav a:after{content:"↗";position:static;display:block!important;inset:auto;width:auto;height:auto;margin-left:auto;background:transparent;font:400 18px/1 Arial,sans-serif;transform:none}
}
@media(max-width:700px){header.seo-header.v145-seo-header .seo-header-actions .seo-contact{display:none!important}}
@media(max-width:600px){
 .joanne-site #site-header-v145 .v145-header-inner,header.seo-header.v145-seo-header .seo-header-inner{width:calc(100% - 36px)!important;min-height:67px!important;gap:10px!important;column-gap:10px!important;padding:10px 0!important}
 .joanne-site #site-header-v145 .v145-brand:before,header.seo-header.v145-seo-header .brand:before{font-size:21px}
 .joanne-site #site-header-v145 .v145-header-actions{gap:8px!important}
 .joanne-site #site-header-v145 .v145-header-apply,header.seo-header.v145-seo-header .seo-header-actions .seo-apply{min-height:44px!important;padding:11px 15px!important;font-size:11px!important;gap:8px!important}
 .joanne-site #site-header-v145 .v145-header-apply svg,header.seo-header.v145-seo-header .seo-apply svg{display:none!important}
 .joanne-site #site-header-v145 .v145-menu,header.seo-header.v145-seo-header .seo-menu-toggle{flex-basis:74px!important;width:74px!important;min-width:74px!important}
 .joanne-site #site-header-v145 .v145-menu:before,header.seo-header.v145-seo-header .seo-menu-toggle:before{left:12px!important}
 .joanne-site #site-header-v145 .v145-menu:after,header.seo-header.v145-seo-header .seo-menu-toggle:after{left:35px!important}
}
@media(max-width:360px){
 .joanne-site #site-header-v145 .v145-header-inner,header.seo-header.v145-seo-header .seo-header-inner{width:calc(100% - 28px)!important;gap:8px!important;column-gap:8px!important}
 .joanne-site #site-header-v145 .v145-header-apply,header.seo-header.v145-seo-header .seo-header-actions .seo-apply{padding-inline:13px!important}
 .joanne-site #mobile-menu{padding-inline:24px!important}
 .joanne-site #mobile-menu nav a{font-size:25px!important;column-gap:10px!important}
}
@media(max-height:740px){
 .joanne-site #mobile-menu{padding-top:max(19px,env(safe-area-inset-top))!important;padding-bottom:max(22px,env(safe-area-inset-bottom))!important}
 .joanne-site #mobile-menu .mobile-dialog-header{padding-bottom:18px!important}
 .joanne-site #mobile-menu nav{margin-top:18px!important;margin-bottom:26px!important}
 .joanne-site #mobile-menu nav a{min-height:56px!important;padding-block:12px!important;font-size:24px!important}
}
@media(prefers-reduced-motion:no-preference){
 .joanne-site #mobile-menu[open]{animation:v149-menu-enter .28s cubic-bezier(.2,.7,.3,1) both}
 .joanne-site #mobile-menu[open]::backdrop{animation:v149-menu-fade .25s ease both}
}
@keyframes v149-menu-enter{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:translateX(0)}}
@keyframes v149-menu-fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 .joanne-site #site-header-v145 *,.joanne-site #site-header-v145 *:before,.joanne-site #site-header-v145 *:after,
 header.seo-header.v145-seo-header *,header.seo-header.v145-seo-header *:before,header.seo-header.v145-seo-header *:after,
 .joanne-site #mobile-menu,.joanne-site #mobile-menu *,.joanne-site #mobile-menu::backdrop{animation:none!important;transition:none!important}
}

/* V152: match the Hero's rectangular primary action and center every CTA label. */
.joanne-site #site-header-v145 .v145-header-apply,header.seo-header.v145-seo-header .seo-header-actions .seo-apply{
 display:grid!important;place-items:center!important;text-align:center!important;gap:0!important;min-width:116px!important;border-radius:6px!important;background:#06c167!important;border-color:#06c167!important;color:#07140d!important;
}
.joanne-site #site-header-v145 .v145-header-apply svg,header.seo-header.v145-seo-header .seo-apply svg{display:none!important}
.joanne-site #site-header-v145 .v145-header-apply:hover,header.seo-header.v145-seo-header .seo-header-actions .seo-apply:hover{background:#28d47e!important;border-color:#28d47e!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn{display:grid!important;place-items:center!important;justify-content:center!important;text-align:center!important;border-radius:6px!important;gap:0!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary{background:#06c167!important;border-color:#06c167!important;color:#07140d!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary svg{display:none!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-outline{border-color:#ffffffb3!important}
.joanne-site #mobile-menu .mobile-dialog-bottom p{text-align:center!important}
.joanne-site #mobile-menu .mobile-dialog-bottom .btn-primary:hover{background:#28d47e!important;border-color:#28d47e!important}
@media(max-width:600px){.joanne-site #site-header-v145 .v145-header-apply,header.seo-header.v145-seo-header .seo-header-actions .seo-apply{min-width:86px!important}}