:root{--c-primary:#c2410c;--c-primary-d:#9a3412;--c-accent:#0f766e;--c-gold:#d97706;--c-bg:#fffaf3;--c-surface:#fff;--c-text:#292524;--c-muted:#78716c;--c-line:#ede4d8;--c-ad:#2563eb;--c-wa:#15803d;
--fs-sm:.82rem;--fs-base:1rem;--fs-lg:1.2rem;--fs-xl:1.6rem;--fs-2xl:2.1rem;--sp-1:.25rem;--sp-2:.5rem;--sp-3:.75rem;--sp-4:1rem;--sp-6:1.5rem;--sp-8:2rem;
--r-sm:8px;--r-md:14px;--r-lg:20px;--r-pill:999px;--sh-1:0 1px 3px rgba(60,40,20,.08);--sh-2:0 6px 20px rgba(60,40,20,.12);--bottom-h:64px;
--font:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Noto Sans CJK TC","Microsoft JhengHei",system-ui,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:var(--fs-base);line-height:1.65;color:var(--c-text);background:var(--c-bg);padding-bottom:calc(var(--bottom-h) + env(safe-area-inset-bottom))}
img,svg{max-width:100%}a{color:var(--c-primary)}main{max-width:1120px;margin:0 auto;padding:var(--sp-4)}
h1,h2,h3{line-height:1.3}h2{font-size:var(--fs-xl);margin:var(--sp-8) 0 var(--sp-4)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.proto-bar{background:var(--c-text);color:#fff;text-align:center;font-size:var(--fs-sm);padding:var(--sp-1)}
.site-header{background:var(--c-surface);border-bottom:1px solid var(--c-line);padding:var(--sp-3) var(--sp-4);position:sticky;top:0;z-index:10;box-shadow:var(--sh-1)}
.brand{color:var(--c-primary);text-decoration:none;font-weight:700;display:flex;flex-direction:column;font-size:var(--fs-lg)}.brand [lang=en]{font-size:var(--fs-sm);font-weight:400;color:var(--c-muted)}
.site-nav{display:none;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);margin-top:var(--sp-2)}.site-nav a{color:var(--c-text);font-size:.92rem;text-decoration:none;padding:var(--sp-1) 0}.site-nav a:hover{color:var(--c-primary)}.site-nav [lang=en]{color:var(--c-muted);font-size:var(--fs-sm)}
.bi span{display:block}.bi [lang=en]{color:var(--c-muted);font-size:.92em}h1.bi [lang=en],h2.bi [lang=en]{font-weight:500}
.hero{padding:var(--sp-6) var(--sp-4);margin:0 calc(-1*var(--sp-4));background:linear-gradient(135deg,#fde7d3,#fff3e0 55%,#e6f4f1);border-radius:0 0 var(--r-lg) var(--r-lg)}.hero h1{font-size:var(--fs-2xl);margin:0 0 var(--sp-2)}
.search{margin:var(--sp-4) 0}.search input{font:inherit;width:100%;padding:var(--sp-4) var(--sp-4) var(--sp-4) 2.8rem;border:1px solid var(--c-line);border-radius:var(--r-pill);box-shadow:var(--sh-2);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2378716c' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") no-repeat 1rem center}
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin:var(--sp-4) 0}.cat{display:flex;flex-direction:column;align-items:center;background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-1);text-decoration:none;color:var(--c-text);box-shadow:var(--sh-1);font-weight:500}.cat .ico{font-size:1.6rem;width:3rem;height:3rem;display:grid;place-items:center;border-radius:50%;background:#fdebd8;margin-bottom:var(--sp-1)}.cat small{color:var(--c-muted);font-size:.72rem}
.cta{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.btn{display:inline-block;background:var(--c-primary);color:#fff;border:0;padding:.65rem 1.1rem;border-radius:var(--r-pill);text-decoration:none;font:inherit;font-weight:500;cursor:pointer}.btn:hover{background:var(--c-primary-d)}.btn.alt{background:#fff;color:var(--c-primary);border:1px solid var(--c-primary)}
.grid{display:grid;gap:var(--sp-4);grid-template-columns:1fr}
.card{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--sp-4);overflow-wrap:anywhere;box-shadow:var(--sh-1);transition:box-shadow .2s}.card:hover{box-shadow:var(--sh-2)}.card h3,.card h2{margin:var(--sp-2) 0}.card h2{font-size:1.17em}
.ph{position:relative;margin:calc(-1*var(--sp-4)) calc(-1*var(--sp-4)) var(--sp-3);height:140px;border-radius:var(--r-md) var(--r-md) 0 0;display:grid;place-items:center;overflow:hidden}.ph svg{width:56px;fill:rgba(255,255,255,.75)}
.ph-food{background:linear-gradient(135deg,#f97316,#fbbf24)}.ph-svc{background:linear-gradient(135deg,#0f766e,#5eead4)}.ph-tag{position:absolute;bottom:6px;right:8px;background:rgba(0,0,0,.55);color:#fff;font-size:.7rem;padding:1px 8px;border-radius:var(--r-pill)}
.featured{border:2px solid var(--c-gold)}.sample{border-style:dashed}.badges{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.badge{font-size:.75rem;padding:.1rem .6rem;border-radius:var(--r-pill);font-weight:500}.feat{background:#b45309;color:#fff}.sample-b{background:#e7e5e4;color:#44403c}.ad-b{background:var(--c-ad);color:#fff}
.meta{font-size:var(--fs-sm);color:var(--c-muted)}
.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);margin-top:var(--sp-3)}.act{font:inherit;font-size:var(--fs-sm);padding:.5rem .25rem;border-radius:var(--r-pill);border:1px solid var(--c-line);background:#f5f5f4;color:var(--c-muted)}.act[disabled]{cursor:not-allowed}.act-note{font-size:.75rem;color:#92400e;margin:var(--sp-1) 0 0}
.ad-banner{border:2px dashed var(--c-ad);background:#eff4ff;padding:var(--sp-4);margin:var(--sp-4) 0;display:flex;flex-direction:column;align-items:center;gap:var(--sp-1);text-align:center;min-height:100px;justify-content:center;border-radius:var(--r-md)}
.ad-label{background:var(--c-ad);color:#fff;font-size:.75rem;padding:.1rem .5rem;border-radius:var(--r-sm)}
.filters{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:var(--sp-4) 0}.chip{font:inherit;border:1px solid var(--c-line);background:#fff;color:var(--c-text);padding:.4rem .9rem;border-radius:var(--r-pill);cursor:pointer}.chip.active{background:var(--c-text);color:#fff}
.list{padding-left:1.2rem}.list li{margin:var(--sp-2) 0}
.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;background:#fff}th,td{border:1px solid var(--c-line);padding:var(--sp-2);text-align:left;vertical-align:top}
.tbd{color:#b45309;font-weight:700}.todo{color:var(--c-muted);font-style:italic}
form{display:grid;gap:var(--sp-3);max-width:600px}label{display:flex;flex-direction:column;font-weight:500;gap:var(--sp-1)}input,select,textarea{font:inherit;padding:.6rem;border:1px solid #d6d3d1;border-radius:var(--r-sm);width:100%;background:#fff}
label.check{flex-direction:row;font-weight:400;align-items:flex-start;gap:var(--sp-2)}label.check input{width:auto;margin-top:.35rem}
.invalid{border-color:#dc2626;background:#fef2f2}.errors{color:#dc2626}.errors ul{margin:0;padding-left:1.2rem}
.status{background:#fffbeb;border:1px solid var(--c-gold);padding:var(--sp-3);border-radius:var(--r-sm)}
.share-box{margin:var(--sp-6) 0;padding:var(--sp-4);background:#ecfdf5;border-radius:var(--r-md);display:flex;flex-direction:column;gap:var(--sp-2)}.btn.wa{background:var(--c-wa);align-self:flex-start}
.warn-big{background:#b45309;color:#fff;text-align:center;font-size:var(--fs-lg);padding:var(--sp-4);border-radius:var(--r-md);margin:var(--sp-4) 0}
.site-footer{background:var(--c-text);color:#e7e5e4;padding:var(--sp-4);font-size:var(--fs-sm);text-align:center}.site-footer a{color:#fed7aa}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;height:calc(var(--bottom-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--c-surface);border-top:1px solid var(--c-line);display:grid;grid-template-columns:repeat(5,1fr);z-index:20;box-shadow:0 -2px 10px rgba(0,0,0,.06)}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:var(--c-muted);font-size:.75rem}.bottom-nav b{font-size:1.25rem;line-height:1}.bottom-nav a[aria-current]{color:var(--c-primary)}
[hidden]{display:none!important}
@media(min-width:768px){body{padding-bottom:0}.bottom-nav{display:none}.site-nav{display:flex}.site-header{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4)}
.grid{grid-template-columns:repeat(2,1fr)}.grid.deals,.grid.life,#dir{grid-template-columns:repeat(3,1fr)}.cats{grid-template-columns:repeat(6,1fr)}.hero{padding:var(--sp-8);margin:var(--sp-4) 0;border-radius:var(--r-lg)}}
.zh-toggle{font:inherit;font-size:var(--fs-sm);border:1px solid var(--c-primary);color:var(--c-primary);background:#fff;border-radius:var(--r-pill);padding:.2rem .8rem;cursor:pointer;position:absolute;top:var(--sp-3);right:var(--sp-4)}
.site-header{position:sticky}
@media(max-width:767px){.site-nav{display:flex;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none;margin-right:calc(-1*var(--sp-4))}.site-nav [lang=en]{display:none}}
@media(min-width:768px){.site-header{flex-wrap:wrap;padding-right:6rem}}
.view-toggle{display:flex;gap:var(--sp-2);margin:var(--sp-4) 0}
.map-banner{background:#fffbeb;border:1px solid var(--c-gold);border-radius:var(--r-sm);padding:var(--sp-3);margin-bottom:var(--sp-2);font-size:var(--fs-sm)}
#map{height:420px;border-radius:var(--r-md);border:1px solid var(--c-line)}
#lyb-preview{max-width:240px;border-radius:var(--r-sm);border:1px solid var(--c-line)}

.proto-note{font-size:.75rem;color:#d6d3d1;margin-top:var(--sp-2)}
.card.invite{border:2px dashed var(--c-line);display:flex;flex-direction:column;gap:var(--sp-2);justify-content:center}
.more-list{list-style:none;padding:0;display:grid;gap:var(--sp-2)}.more-list a{display:block;padding:var(--sp-3) var(--sp-4);border:1px solid var(--c-line);border-radius:12px;background:var(--c-surface);color:var(--c-text);text-decoration:none;min-height:44px}.more-list a:focus-visible,.site-nav a:focus-visible,.bottom-nav a:focus-visible{outline:3px solid var(--c-primary);outline-offset:2px}
.ad-slot-wrap{margin:var(--sp-4) 0}.ad-slot{display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-4);border:1px solid var(--c-line);border-left:4px solid var(--c-primary);border-radius:var(--r-md);background:linear-gradient(135deg,#fff7ed,#fff);color:var(--c-text);text-decoration:none;box-shadow:var(--sh-1);transition:box-shadow .2s}.ad-slot:hover{box-shadow:0 4px 14px rgba(0,0,0,.08)}.ad-slot:focus-visible{outline:3px solid var(--c-primary-d);outline-offset:3px}.ad-slot .ad-label{align-self:flex-start;background:#fff;color:#57534e;border:1px solid var(--c-line);font-size:.75rem;padding:.1rem .5rem;border-radius:var(--r-sm)}.ad-slot strong{font-size:1.1rem}.ad-slot .ad-sub{color:#57534e;font-size:var(--fs-sm)}.ad-slot .ad-cta{color:var(--c-primary-d);font-weight:700;margin-top:var(--sp-1)}.ad-slot .ad-cta [lang=en]{font-weight:500}
h2.h3{font-size:1.17em;margin:1em 0}.card h2.h3{margin:var(--sp-2) 0}
.lang-switch{display:inline-flex;border:1px solid var(--c-primary);border-radius:var(--r-pill);overflow:hidden}.lang-switch button{font:inherit;font-size:var(--fs-sm);background:#fff;color:var(--c-primary-d);border:0;padding:.3rem .65rem;min-width:44px;min-height:36px;cursor:pointer}.lang-switch button[aria-pressed=true]{background:var(--c-primary-d);color:#fff}.lang-switch button:focus-visible{outline:3px solid var(--c-primary-d);outline-offset:-3px}
html.m-zh [lang="en"]:not(html){display:none!important}html.m-en body [lang^="zh"]:not([data-lang]){display:none!important}
.lang-switch{position:absolute;top:var(--sp-3);right:var(--sp-4)}
.affil{background:#fef3c7;color:#78350f;border:1px solid #f59e0b}
/* ===== Design N 霓虹格線：舊頁面元件對應 N-spec tokens（只新增，不改 spec） =====
 * 載入順序：n-tokens.css → n-components.css → style.css */
:root{--c-primary:var(--n-color-accent);--c-primary-d:var(--n-color-accent);--c-accent:var(--n-neon-cyan);--c-gold:var(--n-color-accent);--c-bg:var(--n-color-bg);--c-surface:var(--n-color-surface);--c-text:var(--n-color-text);--c-muted:var(--n-color-text-muted);--c-line:var(--n-color-border);--c-ad:var(--n-color-info);--sh-1:none;--sh-2:var(--n-shadow-card);--font:var(--n-font-zh-hant)}
[hidden]{display:none!important}
body{font-family:var(--font);font-size:var(--n-fs-base);line-height:var(--n-lh-body)}
/* n-components.css 的全域 reset（* margin/padding 0、a 無底線）會影響舊頁面，這裡補回舊頁面的間距與連結樣式 */
:where(main:not(.n-home)) :where(p,ul,ol,table,form,fieldset,section,article.guide>*){margin-block:0 var(--n-space-3)}
:where(main:not(.n-home)) :where(ul,ol){padding-left:1.4em}:where(main:not(.n-home)) :where(h1){margin:var(--n-space-4) 0 var(--n-space-3)}:where(main:not(.n-home)) :where(h3){margin:var(--n-space-3) 0 var(--n-space-2)}
:where(main:not(.n-home)) :where(label){display:block;margin-bottom:var(--n-space-3)}
:where(main,.site-footer) :where(p,li,td,span.bi>span) > a:not([class]){color:var(--n-color-accent);text-decoration:underline;text-underline-offset:2px}
.site-footer p{margin:0 0 var(--n-space-2)}
/* 共用元件：header / chips / 語言 / 底部導覽 / 頁尾（spec class 加在既有元素上） */
.site-header.n-header{box-shadow:none}
.brand.n-logo{color:var(--n-color-text);display:flex;flex-direction:column;white-space:normal;padding-right:140px}.brand.n-logo [lang=en]{color:var(--n-color-text-muted);font-weight:var(--n-fw-regular)}
.site-nav.n-chips{display:flex;flex-wrap:nowrap}.site-nav.n-chips a{display:inline-flex;align-items:center;gap:4px;color:var(--n-color-text);min-height:32px;text-decoration:none}.site-nav.n-chips a:hover{border-color:var(--n-color-accent)}.site-nav.n-chips a[aria-current] [lang=en]{color:var(--n-color-on-accent)}
/* spec 的 n-lang 只定義 <a>；本站用 <button aria-pressed>（切換按鈕語意），以下為新增 */
.lang-switch.n-lang{background:var(--n-color-surface);padding:2px}.n-lang button{font:inherit;font-size:var(--n-fs-xs);font-weight:var(--n-fw-bold);background:transparent;border:0;border-radius:var(--n-radius-pill);color:var(--n-color-text-muted);min-width:40px;min-height:36px;padding:4px 9px;cursor:pointer}.n-lang button[aria-pressed=true]{background:var(--n-color-accent);color:var(--n-color-on-accent)}
.bottom-nav.n-bottomnav{display:grid;height:calc(var(--n-bottomnav-h) + env(safe-area-inset-bottom));box-shadow:none}.bottom-nav.n-bottomnav a{font-size:var(--n-fs-xs);min-height:var(--n-tap-min);text-decoration:none}.bottom-nav.n-bottomnav b{font-size:20px}
@media(min-width:768px){.bottom-nav.n-bottomnav{display:none}}
.site-footer.n-footer{color:var(--n-color-text-muted);text-align:center;font-size:var(--n-fs-sm)}.site-footer.n-footer a{color:var(--n-color-accent)}.proto-note{color:var(--n-color-text-muted)}
/* 舊頁面元件改用 N tokens */
.hero{background:var(--n-grad-hero);border:1px solid var(--n-color-border)}
.card{background:var(--n-color-surface);border-color:var(--n-color-border)}.featured{border:1px solid var(--n-color-accent)}.sample{border-style:dashed}
.btn{background:var(--n-color-accent);color:var(--n-color-on-accent);font-weight:var(--n-fw-black);min-height:var(--n-tap-min);display:inline-flex;align-items:center;text-decoration:none}.btn:hover{background:var(--n-color-accent-hover)}.btn.alt{background:var(--n-color-surface-2);color:var(--n-color-text);border:1px solid var(--n-color-border-strong)}.btn.wa{background:var(--n-color-success);color:var(--n-color-on-accent)}
.chip{background:var(--n-color-surface);color:var(--n-color-text);border-color:var(--n-color-border)}.chip.active{background:var(--n-color-accent);color:var(--n-color-on-accent);border-color:var(--n-color-accent)}
input,select,textarea{background:var(--n-color-surface-2);color:var(--n-color-text);border:1px solid var(--n-color-border-strong);border-radius:var(--n-radius-md)}input::placeholder,textarea::placeholder{color:var(--n-color-text-muted)}
.search input{background-color:var(--n-color-surface);border-color:var(--n-color-border);color:var(--n-color-text);box-shadow:none}
.invalid{border-color:var(--n-color-danger);background:var(--n-color-surface-2)}.errors{color:var(--n-color-danger)}.status,.map-banner{background:var(--n-color-surface-2);border-color:var(--n-color-accent);color:var(--n-color-text)}
table{background:var(--n-color-surface)}th,td{border-color:var(--n-color-border)}th{background:var(--n-color-surface-2)}
.tbd,.act-note,.todo{color:var(--n-color-accent)}.share-box{background:var(--n-color-surface);border:1px solid var(--n-color-border)}
.sample-b{background:var(--n-color-surface-2);color:var(--n-color-text-muted);border:1px solid var(--n-color-border-strong)}.feat{background:var(--n-color-badge);color:#fff}.ad-b{background:var(--n-color-surface-2);color:var(--n-color-info);border:1px solid currentColor}.verified{background:#0F5E57;color:#fff}
.affil{background:#3A2A06;color:#FDE68A;border:1px solid #B45309}
.ad-slot{background:var(--n-grad-cyan);border:1px solid var(--n-color-border);border-left:4px solid var(--n-color-accent);color:var(--n-color-text);text-decoration:none}.ad-slot .ad-label{background:transparent;color:var(--n-color-text-muted);border-color:var(--n-color-border-strong)}.ad-slot .ad-sub{color:var(--n-color-text-muted)}.ad-slot .ad-cta{color:var(--n-color-accent)}.ad-slot:focus-visible{outline:2px solid var(--n-color-focus)}
.card.invite{border:1px dashed var(--n-color-border-strong)}.ph-tag{background:rgba(0,0,0,.7)}.warn-big{background:#7F1D1D}
.more-list a{background:var(--n-color-surface);border-color:var(--n-color-border);color:var(--n-color-text)}
/* ===== 首頁 N 元件：spec 沒有的元件（新增，命名依 spec 規則） ===== */
.n-tag--affiliate{background:#3A2A06;color:#FDE68A;border-color:#B45309}
.n-home{max-width:var(--n-container);padding:var(--n-space-3) var(--n-space-4)}
.n-intro{margin:var(--n-space-1) 0 var(--n-space-3)}.n-intro__title{font-size:var(--n-fs-lg);font-weight:var(--n-fw-black);line-height:var(--n-lh-snug);margin-bottom:var(--n-space-2)}
.n-intro__search{margin:0}.n-intro__search input{min-height:var(--n-tap-min);padding:0 var(--n-space-4) 0 2.6rem;border-radius:var(--n-radius-pill);font-size:var(--n-fs-sm);background-position:.9rem center}
.n-hero{position:relative;border-radius:var(--n-radius-lg);overflow:hidden;background:var(--n-grad-hero);min-height:240px;display:flex;align-items:flex-end;border:1px solid var(--n-color-border)}
.n-hero img{position:absolute;right:-30px;top:0;width:78%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}
.n-hero__body{position:relative;padding:var(--n-space-4)}.n-hero__tags{display:flex;gap:6px;flex-wrap:wrap}.n-hero__title{font-size:var(--n-fs-display);line-height:var(--n-lh-tight);font-weight:var(--n-fw-black);margin:var(--n-space-2) 0 var(--n-space-1);text-shadow:var(--n-shadow-text)}.n-hero__text{font-size:var(--n-fs-sm);color:var(--n-color-text);margin-bottom:var(--n-space-3);text-shadow:var(--n-shadow-text)}
.n-hero .n-btn--ghost,.n-bento .n-btn--ghost,.n-features .n-btn--ghost{background:rgba(0,0,0,.45)}
.n-section-head{display:flex;justify-content:space-between;align-items:center;gap:var(--n-space-2);margin:var(--n-space-6) 0 var(--n-space-3)}.n-section-head h2{font-size:var(--n-fs-h2);font-weight:var(--n-fw-black);margin:0}.n-section-head a{font-size:var(--n-fs-xs);border:1px solid var(--n-color-border);border-radius:var(--n-radius-pill);padding:6px 12px;color:var(--n-color-text);white-space:nowrap}
.n-catgrid{display:grid;grid-auto-flow:column;grid-auto-columns:92px;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:var(--n-space-1)}
.n-catgrid__item{background:var(--n-color-surface);border:1px solid var(--n-color-border);border-radius:var(--n-radius-md);padding:14px 6px 10px;text-align:center;font-size:var(--n-fs-xs);display:flex;flex-direction:column;align-items:center;gap:6px;min-height:var(--n-tap-min)}.n-catgrid__item:hover{border-color:var(--n-color-accent)}.n-catgrid__icon{font-size:26px;color:var(--n-color-accent);line-height:1}
.n-bento{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.n-bento__tile{display:block;min-height:170px;border-color:var(--n-color-border)}.n-bento__tile:hover{border-color:var(--n-glow-color)}
.n-bento__tile img{position:absolute;right:-16px;bottom:-10px;width:68%;height:80%;object-fit:cover;border-radius:var(--n-radius-md);-webkit-mask-image:radial-gradient(circle at 60% 60%,#000 55%,transparent 75%);mask-image:radial-gradient(circle at 60% 60%,#000 55%,transparent 75%)}
.n-bento__body{position:relative;z-index:1;padding:14px;height:100%;display:flex;flex-direction:column;align-items:flex-start;gap:var(--n-space-1)}.n-bento__body .n-tag{background:rgba(0,0,0,.55)}
.n-bento__title{font-size:var(--n-fs-h3);line-height:var(--n-lh-tight);font-weight:var(--n-fw-black);margin:2px 0 auto;text-shadow:var(--n-shadow-text)}.n-bento__body .n-btn{margin-top:var(--n-space-3)}
.n-bento__tile--b1{grid-row:span 2}.n-bento__tile--b1 img{width:100%;height:62%;right:0;bottom:0;border-radius:0;-webkit-mask-image:linear-gradient(180deg,transparent,#000 30%);mask-image:linear-gradient(180deg,transparent,#000 30%)}.n-bento__tile--b4{grid-column:span 2;min-height:150px}.n-bento__tile--b4 img{width:55%}
.n-card--merchant{margin-bottom:10px}.n-card__tags{display:flex;gap:6px;flex-wrap:wrap}.n-card--merchant .act-note{font-size:var(--n-fs-xs);margin:0}
.n-card--invite{border-style:dashed;border-color:var(--n-color-border-strong)}
.n-list{list-style:none;padding:0;margin:0;background:var(--n-color-surface);border:1px solid var(--n-color-border);border-radius:var(--n-radius-lg)}.n-list li{margin:0}
.n-list__item{display:flex;gap:10px;padding:12px 14px;border-bottom:1px solid var(--n-color-border);font-size:var(--n-fs-sm);align-items:center;min-height:var(--n-tap-min)}.n-list li:last-child .n-list__item{border:0}.n-list__kicker{font-style:normal;font-size:var(--n-fs-xs);font-weight:var(--n-fw-black);color:var(--n-color-accent);flex:0 0 3.2em}
.n-features{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:10px;overflow-x:auto;scrollbar-width:none}
.n-feature{display:block;padding:var(--n-space-4);background:linear-gradient(180deg,var(--n-color-surface),var(--n-color-bg))}.n-feature:hover{border-color:var(--n-glow-color)}.n-feature__title{font-size:var(--n-fs-h3);line-height:var(--n-lh-tight);font-weight:var(--n-fw-black);margin:10px 0 14px}.n-feature__title em{font-style:normal;color:var(--k)}
.n-home .ad-slot-wrap{margin-top:var(--n-space-5)}.n-home .share-box{margin-top:var(--n-space-4)}.n-footnote{font-size:var(--n-fs-xs);color:var(--n-color-text-muted);text-align:center;margin:var(--n-space-4) 0 0}
@media(min-width:900px){.n-home{padding:var(--n-space-4) var(--n-space-6)}.n-intro{display:flex;align-items:center;gap:var(--n-space-6)}.n-intro__title{margin:0;white-space:nowrap}.n-intro__search{flex:1;max-width:560px}
.n-hero{min-height:380px;align-items:center}.n-hero img{width:62%;right:0}.n-hero__body{padding:var(--n-space-10) var(--n-space-12);max-width:560px}
.n-catgrid{grid-auto-flow:row;grid-template-columns:repeat(9,1fr);overflow:visible}
.n-bento{grid-template-columns:1fr 1.2fr 1fr;grid-auto-rows:200px}.n-bento__tile--b1{grid-column:2;grid-row:1/span 2}.n-bento__tile--b0{grid-column:1;grid-row:1}.n-bento__tile--b2{grid-column:3;grid-row:1}.n-bento__tile--b3{grid-column:1;grid-row:2}.n-bento__tile--b4{grid-column:3;grid-row:2;min-height:0}
.n-split{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--n-space-5)}
.n-features{grid-auto-flow:row;grid-template-columns:repeat(4,1fr);overflow:visible}}
.site-nav.n-chips a{padding:5px 14px;font-size:var(--n-fs-sm)}
.ad-banner{background:var(--n-color-surface);border-color:var(--n-color-border-strong);color:var(--n-color-text)}.ad-banner .ad-label{background:var(--n-color-surface-2);color:var(--n-color-text-muted)}
.site-nav.n-chips a[aria-current="page"],.site-nav.n-chips a[aria-current="page"] span{color:var(--n-color-on-accent)}
.site-footer.n-footer{background:var(--n-color-surface);color:var(--n-color-text-muted)}.site-footer.n-footer a{color:var(--n-color-accent)}
/* ===== Design N 各頁（N-spec/pages → n-pages.css）：舊標記套用頁面樣式 ===== */
main.n-pg{max-width:var(--n-container);padding:var(--n-space-4) var(--n-space-4) calc(var(--n-bottomnav-h) + var(--n-space-6))}
.hero.n-pg-hero{margin:0 0 var(--n-space-4);padding:var(--n-space-5);border-radius:var(--n-radius-lg)}
.n-pg-hero h1{margin:6px 0}.n-pg-hero h1.bi>span[lang="en"]{display:block;font-size:var(--n-fs-xs);color:var(--n-color-text-muted);font-weight:400;margin-top:2px;text-shadow:none}
html.m-en .n-pg-hero h1.bi>span[lang="en"]{font-size:inherit;color:inherit;font-weight:inherit}
.n-pg-hero>p,.n-pg-hero>p.bi{font-size:var(--n-fs-sm)}
.n-pg-hero>.n-pg-ai{position:absolute;right:8px;bottom:8px;max-width:none;font-size:10px;padding:2px 6px;border-radius:var(--n-radius-pill);background:rgba(0,0,0,.65);color:var(--n-color-text)}
.n-pg-hero>.n-tag{align-self:flex-start}
.n-pg .card,.n-pg .feat,.n-pg .table-wrap{background:var(--n-color-surface);border:1px solid var(--n-color-border);border-radius:var(--n-radius-lg)}
.n-pg .card{padding:var(--n-space-4);position:relative;overflow:hidden}
.n-pg .card:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--n-glow-color,var(--n-neon-cyan)),transparent);opacity:.7}
.n-pg .card.featured{--n-glow-color:var(--n-neon-red)}
.n-pg h2{font-weight:var(--n-fw-black)}
.n-pg table{width:100%;border-collapse:collapse;font-size:var(--n-fs-sm)}.n-pg th,.n-pg td{text-align:left;padding:var(--n-space-3);border-bottom:1px solid var(--n-color-border);vertical-align:top}.n-pg th{color:var(--n-color-text-muted);font-size:var(--n-fs-xs);letter-spacing:var(--n-ls-kicker)}
.n-pg .more-list{list-style:none;padding:0;background:var(--n-color-surface);border:1px solid var(--n-color-border);border-radius:var(--n-radius-lg)}.n-pg .more-list li{margin:0;border-bottom:1px solid var(--n-color-border)}.n-pg .more-list li:last-child{border:0}.n-pg .more-list a{display:flex;align-items:center;min-height:var(--n-tap-min);padding:var(--n-space-3) var(--n-space-4);color:var(--n-color-text);text-decoration:none}.n-pg .more-list a:after{content:"›";margin-left:auto;color:var(--n-color-text-muted)}
.n-pg-art-wrap{margin-top:var(--n-space-3)}.n-pg-toc{margin-bottom:var(--n-space-4)}.n-pg-toc__t{display:block;margin-bottom:8px}.n-pg-toc a{color:var(--n-color-text-muted);text-decoration:none}.n-pg-toc a:hover{color:var(--n-color-accent)}
.n-pg-art h2{font-size:var(--n-fs-lg)}
a[href^="tel:"]{white-space:nowrap}
.n-pg .warn-big{background:var(--n-color-surface);border-left:3px solid var(--n-color-warning);border-radius:0 var(--n-radius-md) var(--n-radius-md) 0;color:var(--n-color-text)}
.n-pg-hero h1{font-size:var(--n-fs-h1);font-weight:var(--n-fw-black);line-height:var(--n-lh-tight)}
@media(min-width:900px){.n-pg-hero h1{font-size:var(--n-fs-display)}.hero.n-pg-hero{padding:var(--n-space-10)}}
.n-pg .ph.ph-img{position:relative;padding:0;background:var(--n-color-surface-2);overflow:hidden}.n-pg .ph.ph-img img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.n-pg .card.biz:has(.ph-img),.n-pg .card:has(>.ph-img){padding:0}.n-pg .card:has(>.ph-img)>:not(.ph){margin-left:var(--n-space-4);margin-right:var(--n-space-4)}.n-pg .card:has(>.ph-img)>:last-child{margin-bottom:var(--n-space-4)}
@media(max-width:899px){.n-pg .card:has(>.ph-img){display:grid;grid-template-columns:120px 1fr;column-gap:0;align-content:start}.n-pg .card:has(>.ph-img)>.ph{grid-row:1/span 12;height:100%;margin:0;border-radius:0}.n-pg .card:has(>.ph-img)>.ph img{aspect-ratio:auto;min-height:100%}.n-pg .card:has(>.ph-img)>:not(.ph){grid-column:2;margin-left:var(--n-space-3);margin-right:var(--n-space-3)}.n-pg .card:has(>.ph-img)>:nth-child(2){margin-top:var(--n-space-3)}}
.hero.n-pg-hero h1.bi{font-size:var(--n-fs-h1)}@media(min-width:900px){.hero.n-pg-hero h1.bi{font-size:var(--n-fs-display)}}
.n-more__card{display:grid;grid-template-columns:1fr 96px;align-items:center;min-height:110px;padding:0 var(--n-space-3) 0 0;text-decoration:none;color:var(--n-color-text)}.n-more__card .n-card__body{display:grid;gap:4px;justify-items:start}.n-more__card .n-card__title{font-size:var(--n-fs-lg);font-weight:var(--n-fw-black)}.n-more__card img{width:96px;height:96px;object-fit:cover;border-radius:12px}
.n-more__h{font-size:var(--n-fs-h2);margin:var(--n-space-6) 0 var(--n-space-3)}
main.n-pg :is(p,li,label,td) a:not([class*="btn"]):not(.n-tag){text-decoration:underline;text-underline-offset:2px}
html.m-en .site-nav [lang=en]{display:inline!important;color:inherit;font-size:inherit}html.m-en .brand [lang=en],html.m-en .brand.n-logo [lang=en]{font-size:var(--fs-lg);font-weight:700;color:var(--n-color-text)}.brand.n-logo span{white-space:nowrap}

.n-hero{margin-inline:calc(50% - 50vw);border-radius:0;border-left:0;border-right:0}html,body{overflow-x:clip}
@media(min-width:768px){.n-hero__body{max-width:none;padding-left:max(var(--n-space-12),calc((100vw - var(--n-container))/2 + var(--n-space-4)))}.n-hero__body>*{max-width:520px}}
.n-hero{display:block}.n-hero__track{display:grid;min-height:inherit}.n-hero__slide{grid-area:1/1;position:relative;display:flex;align-items:flex-end;min-height:inherit;overflow:hidden}.n-hero.is-carousel{overflow:hidden}.n-hero.is-carousel .n-hero__slide{transform:translateX(100%);visibility:hidden;transition:transform .6s ease,visibility .6s}.n-hero.is-carousel .n-hero__slide.is-active{transform:none;visibility:visible}.n-hero.is-carousel .n-hero__slide.is-out{visibility:visible}.n-hero.is-carousel .n-hero__slide.no-anim{transition:none}.n-hero.is-carousel .n-hero__body{padding-bottom:calc(var(--n-space-4) + 40px)}
.n-hero__controls{position:absolute;z-index:3;right:var(--n-space-4);bottom:var(--n-space-3);display:flex;align-items:center;gap:6px}.n-hero__btn{width:32px;height:32px;border-radius:var(--n-radius-pill);border:1px solid var(--n-color-border);background:rgba(0,0,0,.55);color:var(--n-color-text);font-size:16px;line-height:1;cursor:pointer}.n-hero__btn--play{font-size:11px}.n-hero__dots{display:flex;gap:2px}.n-hero__dot{width:24px;height:24px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}.n-hero__dot:before{content:"";width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.45);transition:width .2s}.n-hero__dot[aria-current=true]:before{width:20px;border-radius:4px;background:var(--n-color-text)}.n-hero__btn:focus-visible,.n-hero__dot:focus-visible{outline:2px solid var(--n-neon-cyan);outline-offset:2px}
@media(min-width:768px){.n-hero__slide{align-items:center}.n-hero__controls{right:max(var(--n-space-12),calc((100vw - var(--n-container))/2 + var(--n-space-4)))}}
@media(prefers-reduced-motion:reduce){.n-hero__dot:before{transition:none}}
/* cat-2x: category grid icons + labels ~2x */
.n-catgrid{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);grid-auto-columns:auto;overflow:visible;gap:var(--n-space-2)}
.n-catgrid__item{font-size:calc(var(--n-fs-xs)*2);padding:var(--n-space-5) var(--n-space-1) var(--n-space-4);gap:var(--n-space-3);white-space:nowrap;min-width:0}.n-catgrid__icon{font-size:52px}
html.m-en .n-catgrid__item{font-size:var(--n-fs-base)}
@media(min-width:900px){.n-catgrid{grid-template-columns:repeat(9,1fr)}html.m-en .n-catgrid__item{font-size:var(--n-fs-lg)}}
/* p2: directory category filter */
.catbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--n-space-2);margin:var(--n-space-3) 0;padding:var(--n-space-3) var(--n-space-4);border:1px solid var(--n-color-accent);border-radius:var(--n-radius-md);background:var(--n-color-surface)}
.catbar[hidden],.dir-empty[hidden],.catbar__name[hidden]{display:none!important}
.catbar__chip{color:var(--n-color-accent);font-size:var(--n-fs-lg)}.catbar__count{color:var(--n-color-text-muted)}
.catbar__clear{margin-left:auto;color:var(--n-color-accent);text-decoration:underline;min-height:var(--n-tap-min);display:inline-flex;align-items:center}
.dir-empty{text-align:center;padding:var(--n-space-8) var(--n-space-4);border:1px dashed var(--n-color-border);border-radius:var(--n-radius-md);margin:var(--n-space-4) 0}
.dir-empty .catbar__clear{margin-left:var(--n-space-3)}
/* p3: view toggle + category chips on one row */
.dir-toolbar{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--n-space-2);margin:var(--n-space-4) 0;overflow-x:auto;scrollbar-width:thin;padding:2px 2px var(--n-space-1)}
.dir-toolbar .view-toggle,.dir-toolbar .filters{flex-wrap:nowrap;margin:0;flex:none}
.dir-toolbar .view-toggle{padding-right:var(--n-space-2);border-right:1px solid var(--n-color-border)}
.dir-toolbar .chip{white-space:nowrap;flex:none}
/* p4: larger carousel title/body */
.n-hero__title{font-size:calc(var(--n-fs-display)*1.3);overflow-wrap:anywhere}.n-hero__text{font-size:var(--n-fs-lg);line-height:var(--n-lh-normal,1.45)}
@media(min-width:900px){.n-hero__text{font-size:var(--n-fs-h2)}}
@media(min-width:768px){.n-hero__body>*{max-width:640px}}
/* p5: bigger header logo (shared header, all pages) */
.brand.n-logo{padding-right:0;margin-right:calc(var(--n-space-4) + 126px);min-width:0}
.brand.n-logo [lang],html.m-en .brand.n-logo [lang=en]{font-weight:var(--n-fw-black);color:var(--n-color-text);line-height:1.15}
.brand.n-logo [lang^=zh]{font-size:min(28px,calc((100vw - 174px)/8))}
html.m-en .brand.n-logo [lang=en]{font-size:min(28px,calc((100vw - 174px)/12))}
@media(min-width:900px){.brand.n-logo{margin-right:0;flex:none}.brand.n-logo [lang^=zh],html.m-en .brand.n-logo [lang=en]{font-size:calc(var(--fs-lg)*3)}
 .site-header.n-header{flex-wrap:wrap;row-gap:var(--n-space-2);padding-right:calc(126px + var(--n-space-6))}.lang-switch{top:50%;transform:translateY(-50%)}}
/* p5: drop duplicated site name next to homepage search (kept for screen readers as the page h1) */
.n-intro__title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
.n-intro__search{flex:1;max-width:none;width:100%}
/* p6: desktop logo sized so logo + nav + language switch stay on one row (17px scrollbar allowance) */
@media(min-width:900px){.site-header.n-header{flex-wrap:nowrap}.site-nav{flex:none}
 .brand.n-logo [lang^=zh]{font-size:min(calc(var(--fs-lg)*3),calc((100vw - 560px)/8))}
 html.m-en .brand.n-logo [lang=en]{font-size:min(calc(var(--fs-lg)*3),calc((100vw - 630px)/12))}}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- 管理頁內容 CMS（cms.js 插入） ---------- */
.cms-banner{display:block;margin:var(--n-space-3) 0;padding:var(--n-space-3) var(--n-space-4);border-radius:var(--n-radius-md);background:var(--n-color-surface-2);border:1px solid var(--n-color-info);color:var(--n-color-text);font-size:var(--n-fs-base);text-decoration:none}
a.cms-banner:hover{border-color:var(--n-color-accent)}
.cms-banner--warn{border-color:var(--n-color-warning);font-weight:var(--n-fw-bold)}
.cms-closed{padding:var(--n-space-10) var(--n-space-4);text-align:center}
.cms-closed p{color:var(--n-color-text-muted);margin:var(--n-space-4) 0}
