/* 世界RO 官網全站共用：主選單／頁尾（舊頁也用）＋雪花、漂浮、進場、發光動畫（2026-10-02 合服版）
 * 所有頁都引用：<link rel="stylesheet" href="/assets/css/wr-fx.css?v=20261002"> ＋ <script src="/assets/js/wr-fx.js?v=20261002" defer></script>
 * 新頁（build_pages_0930.py 產生）另有 wr.css；舊頁（job、feature、shop…）由安裝包規則 nav1002 插入主選單、頁尾與這兩個檔。
 * 動畫全部尊重「減少動態效果」（prefers-reduced-motion），雪花不擋點擊。顏色：金 #F0C469／#FFE3A1、冰藍 #CFEAFF。
 */

/* ── 主選單（跟新頁 wr.css 同一套；舊頁的 nav{}、a{} 通用樣式在這裡蓋掉） ── */
.wr-nav{position:sticky;top:0;z-index:50;display:block;margin:0;padding:0;width:auto;text-align:left;
  background:rgba(10,8,6,.92);border-bottom:1px solid rgba(227,178,74,.22);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",-apple-system,sans-serif;line-height:1.5;font-size:16px}
.wr-nav *{box-sizing:border-box}
.wr-nav .in{max-width:1180px;margin:0 auto;padding:6px 16px;display:flex;align-items:center;gap:14px;flex-wrap:nowrap}
.wr-nav .logo{flex:0 0 auto;display:block;padding:0;background:none;border:0}
.wr-nav .logo img{height:46px;width:auto;max-width:none;display:block;margin:0;padding:0;border:0;border-radius:0}
.wr-nav .links{display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex:1 1 auto;min-width:0;
  justify-content:flex-start;margin:0;padding:0;flex-wrap:nowrap}
.wr-nav .links::-webkit-scrollbar{display:none}
.wr-nav .links a{flex:0 0 auto;padding:0 11px !important;min-height:44px;display:inline-flex;align-items:center;border-radius:999px;
  color:#EFE7DA;font-size:14.5px !important;font-weight:400;line-height:1.3;white-space:nowrap;text-decoration:none;
  background:none;border:0;margin:0;letter-spacing:0;text-shadow:none;transition:background .2s,color .2s,box-shadow .25s}
.wr-nav .links a:hover{background:rgba(240,196,105,.12);color:#FFE3A1;box-shadow:0 0 14px rgba(240,196,105,.28)}
.wr-nav .links a.on{background:linear-gradient(180deg,#F0C469,#9C7424);color:#1B130B;font-weight:700}
/* 註冊／儲值／排行榜：金框，一眼看得到 */
.wr-nav .links a.x{border:1px solid rgba(240,196,105,.55);color:#FFE3A1;margin-left:2px}
.wr-nav .links a.x.reg{background:linear-gradient(180deg,#C8412A,#7A1F14);border-color:#E06A4E;color:#FFF3E0;font-weight:700}
.wr-nav .links a.x.on{color:#1B130B}
.wr-nav .links.fr{-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
.wr-nav .links.fl{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%);mask-image:linear-gradient(90deg,transparent,#000 18%)}
.wr-nav .links.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
/* 桌機：選單放得下就不捲、靠右；放不下（窄一點的筆電）自動換第二排，不會被切掉 */
@media(min-width:1100px){
  .wr-nav .links{flex-wrap:wrap;overflow:visible;justify-content:flex-end;row-gap:2px}
  .wr-nav .links a{min-height:40px;padding:0 10px !important}
  .wr-nav .links.fl,.wr-nav .links.fr{-webkit-mask-image:none;mask-image:none}
}
@media(max-width:760px){
  .wr-nav .in{gap:6px;padding:4px 0 4px 12px}
  .wr-nav .logo img{height:34px}
  .wr-nav .links{padding-right:8px}
  .wr-nav .links a{font-size:14px !important;padding:0 11px !important}
}

/* 舊說明頁、條款三頁原本的頂端列（世界RO／下載／註冊／儲值／排行榜）已經都在主選單裡 → 藏起來，免得兩排選單 */
.wr-nav.wr-g ~ .nav{display:none !important}

/* ── 頁尾（舊頁插入的跟新頁同一套） ── */
.wr-foot{display:block;border-top:1px solid rgba(227,178,74,.22);background:rgba(10,8,6,.92);margin:20px 0 0;padding:0;text-align:center;
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",-apple-system,sans-serif;line-height:1.6;text-shadow:none;position:relative;z-index:2}
.wr-foot .in{max-width:1100px;margin:0 auto;padding:20px 16px 26px;display:flex;flex-wrap:wrap;gap:6px 16px;
  align-items:center;justify-content:center;color:#B3A58F;font-size:14.5px !important}
.wr-foot a{color:#F0C469;display:inline-block;padding:10px 4px !important;min-height:44px;font-size:14.5px !important;text-decoration:none}
.wr-foot a:hover{color:#FFE3A1}
.wr-foot .more{flex-basis:100%;display:flex;flex-wrap:wrap;gap:0 14px;justify-content:center;align-items:center;
  border-top:1px dashed rgba(227,178,74,.22);margin-top:6px;padding-top:4px}
.wr-foot .more span{color:#B3A58F;font-size:13.5px !important}
.wr-foot .more a{font-size:14px !important}
.wr-foot .cp{flex-basis:100%;text-align:center;font-size:13px !important;margin-top:4px;color:#B3A58F}

/* ── 雪花（wr-fx.js 畫在這張 canvas；不擋點擊） ── */
#wr-snow{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:40}

/* ── 漂浮：圖片、Logo、卡片緩慢上下（各張由 JS 錯開時間） ── */
@keyframes wrFloat{0%{transform:translateY(0)}50%{transform:translateY(var(--wr-amp,-6px))}100%{transform:translateY(0)}}
.wr-float{animation:wrFloat var(--wr-dur,7s) ease-in-out var(--wr-delay,0s) infinite;will-change:transform}
.wr-float.sm{--wr-amp:-3px}
/* Logo 微微漂浮＋柔光 */
@keyframes wrGlow{0%,100%{filter:drop-shadow(0 0 4px rgba(240,196,105,.35))}50%{filter:drop-shadow(0 0 12px rgba(255,227,161,.75))}}
.wr-nav .logo img{animation:wrFloat 6s ease-in-out infinite,wrGlow 4.5s ease-in-out infinite;--wr-amp:-2px}

/* ── 主視覺光暈脈動 ── */
@keyframes wrHalo{0%,100%{box-shadow:0 0 0 1px rgba(240,196,105,.25),0 0 22px rgba(240,196,105,.18),0 0 60px rgba(160,210,255,.08)}
  50%{box-shadow:0 0 0 1px rgba(255,227,161,.5),0 0 34px rgba(240,196,105,.38),0 0 90px rgba(160,210,255,.18)}}
.wr-halo{animation:wrHalo 5s ease-in-out infinite;border-radius:14px}

/* ── 標題金色閃光掃過（只掃一次後偶爾再掃，不影響閱讀） ── */
@keyframes wrShine{0%{background-position:120% 0}22%{background-position:-20% 0}100%{background-position:-20% 0}}
.wr-shine{background-image:linear-gradient(105deg,#FFFFFF 0%,#F0C469 34%,#FFF6D6 46%,#FFFFFF 50%,#FFF6D6 54%,#F0C469 66%,#E8B95A 100%) !important;
  background-size:260% 100% !important;-webkit-background-clip:text !important;background-clip:text !important;
  color:transparent !important;-webkit-text-fill-color:transparent;animation:wrShine 9s ease-in-out 1s infinite}

/* ── 按鈕／連結卡 hover 發光 ── */
a.btn,a.tile,a.more,.card,.button,.wr-cta a,.wr-hl a{transition:box-shadow .25s,transform .25s,filter .25s}
a.btn:hover,a.tile:hover,.button:hover,.wr-cta a:hover,.wr-hl a:hover{box-shadow:0 0 0 1px rgba(255,227,161,.55),0 0 18px rgba(240,196,105,.55),0 0 36px rgba(160,210,255,.18);filter:brightness(1.08)}

/* ── 「看…詳情 ›」這類連結＝按鈕（1002 REX「弄個按鈕，玩家比較好分辨」；新頁產生器 go_btn()、首頁規則 home1002 加 class wr-go）
     金框深底圓角、hover 金底深字＋發光；手機點擊區 44px；長字會換行不撐版 ── */
a.wr-go{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;max-width:100%;min-height:44px;
  margin:8px 8px 0 0;padding:8px 16px 8px 18px;border-radius:999px;border:1px solid rgba(240,196,105,.75);
  background:linear-gradient(180deg,rgba(62,45,24,.96),rgba(22,16,10,.96));color:#FFE3A1 !important;
  font-weight:700;font-size:14.5px !important;line-height:1.4;letter-spacing:.02em;text-align:center;text-decoration:none !important;
  white-space:normal;overflow-wrap:anywhere;vertical-align:middle;box-shadow:0 2px 10px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,227,161,.2);
  transition:box-shadow .25s,filter .25s,background .25s,color .25s}
a.wr-go:hover,a.wr-go:focus-visible{background:linear-gradient(180deg,#F6D27E,#B08431);color:#1B130B !important;border-color:#FFE3A1;outline:0;
  box-shadow:0 0 0 1px rgba(255,227,161,.55),0 0 18px rgba(240,196,105,.55),0 0 36px rgba(160,210,255,.18)}
.wr-more a.wr-go{margin:6px 0 0 8px}

/* ── 回置頂：長頁面段落大標題左邊的小按鈕（wr-fx.js toTop() 加；REX 10/2）；標題是 flex 的排在最左（金色小條前面），不影響標題換行 ── */
a.wr-top{order:-1;display:inline-flex;align-items:center;gap:3px;flex:0 0 auto;align-self:center;vertical-align:middle;
  margin:0 10px 0 0;padding:3px 10px 3px 8px;min-height:28px;border-radius:999px;border:1px solid rgba(240,196,105,.6);
  background:rgba(14,11,9,.85);color:#F0C469 !important;-webkit-text-fill-color:#F0C469;
  font:700 12.5px/1.2 "Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif !important;letter-spacing:.02em !important;
  text-decoration:none !important;text-shadow:none !important;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
a.wr-top span{font-size:10px !important;line-height:1}
a.wr-top:hover,a.wr-top:focus-visible{background:linear-gradient(180deg,#F6D27E,#B08431);color:#1B130B !important;-webkit-text-fill-color:#1B130B;
  border-color:#FFE3A1;box-shadow:0 0 12px rgba(240,196,105,.5);outline:0}
@media(max-width:600px){a.wr-top{padding:2px 8px 2px 6px;min-height:26px;font-size:12px !important;margin-right:8px}}

/* ── 頁尾「遊戲代理」「遊戲直播」：連官方 LINE；可以滑鼠移上去的裝置顯示小字提示（手機不顯示，不會撐版） ── */
.wr-foot a.wr-biz{position:relative}
@media (hover:hover){
  .wr-foot a.wr-biz:hover::after,.wr-foot a.wr-biz:focus-visible::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% - 4px);
    transform:translateX(-50%);white-space:nowrap;padding:3px 9px;border-radius:7px;background:#1B130B;border:1px solid #9C7424;
    color:#FFE3A1;font-size:12.5px;line-height:1.5;font-weight:400;box-shadow:0 4px 12px rgba(0,0,0,.5);pointer-events:none;z-index:5}
}

/* ── 進場：捲到才淡入上移（JS 只對一開始不在畫面裡的區塊加 .wr-rv，初始看得到的不藏） ── */
.wr-rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.wr-rv.in{opacity:1;transform:none}

/* ── 減少動態效果：全部關掉 ── */
@media (prefers-reduced-motion:reduce){
  #wr-snow{display:none}
  .wr-float,.wr-nav .logo img,.wr-halo,.wr-shine{animation:none !important}
  .wr-rv{opacity:1 !important;transform:none !important;transition:none !important}
}

--EXIT 0--
