/* ============================================================
   伊莉娛樂城 /action/ 取代式改版 — 品牌樣式表
   只加不改:不動 style.css / member.css / marquee.css / fixmenu.css。
   還原方式:控制器的 view 名稱換回舊檔,這支就不會被載入。
   ============================================================ */

/* ---------- 1. 設計 token(單站專用,不跨站共用) ---------- */
:root{
  /* 色票沿用站上既有樣式表的暖橘米白 */
  --bg:        #F4EFE8;
  --bg-2:      #EDE4D8;
  --surface:   #FFFFFF;
  --surface-2: #FBF7F1;
  --line:      #E3D7C6;
  --line-2:    #F0E7DA;

  --brand:      #C4510D;   /* 主要動作:對白字約 5.4:1 */
  --brand-deep: #A23F05;
  --brand-soft: #FF9046;   /* 只用在裝飾漸層,不承載文字 */
  --gold:       #E9A21B;
  --gold-soft:  #FCD535;

  --ink:   #241A12;
  --ink-2: #52412F;
  --ink-3: #6E5B47;
  --on-brand: #FFFFFF;

  --ok:   #1F7A3D;
  --warn: #B4520A;
  --err:  #B3261E;

  /* 間距尺度:全站只從這裡取值 */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
  --edge: 16px;            /* 手機左右留白:不貼邊 */
  --gap:  12px;            /* 小卡之間的間距 */
  --sect: 32px;            /* 區塊上間距(只給上方) */

  --radius:   14px;
  --radius-s: 10px;
  --shadow:   0 2px 10px rgba(66,44,22,.08);
  --shadow-2: 0 8px 28px rgba(66,44,22,.14);

  --hd-h:  60px;
  --bnav-h: 58px;
}
@media (min-width:768px){
  :root{ --edge:24px; --gap:14px; --sect:40px; --hd-h:66px; }
}
@media (min-width:1024px){
  :root{ --edge:32px; --gap:16px; --sect:48px; --hd-h:72px; }
}

/* ---------- 2. 底層 ---------- */
body.eyny{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-text-size-adjust:100%;
  overflow-x:hidden;
  padding-bottom:calc(var(--bnav-h) + var(--s4) + env(safe-area-inset-bottom,0px));
}
@media (min-width:768px){ body.eyny{ padding-bottom:var(--s7); } }

/* 捲軸條全站隱藏(捲動照常,只是不顯示那條灰槓) */
.eyny *{ scrollbar-width:none; -ms-overflow-style:none; }
.eyny *::-webkit-scrollbar{ width:0; height:0; display:none; }

.eyny img{ max-width:100%; height:auto; }
.eyny a{ color:var(--brand); text-decoration:none; }
.eyny a:hover{ color:var(--brand-deep); }
.eyny h1,.eyny h2,.eyny h3,.eyny h4,.eyny h5,.eyny h6{
  margin:0; color:var(--ink); font-weight:700; line-height:1.35;
}
.eyny h1{ font-size:26px; }
.eyny h2{ font-size:24px; }
.eyny h3{ font-size:19px; }
.eyny h4{ font-size:17px; }
.eyny p{ margin:0; }
.eyny ul{ margin:0; padding:0; list-style:none; }

/* 舊全站元件在 v2 頁面一律關掉 */
.eyny .ft-navbar,
.eyny .fixmenu,
.eyny .back-to-top,
.eyny #footer{ display:none !important; }

/* 版面上不需要露出、但語意要在的標題 */
.eyny .sr-only-eyny{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ---------- 3. 版面容器 ---------- */
.eyny .wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding-left:var(--edge);
  padding-right:var(--edge);
}
.eyny .sect{ margin-top:var(--sect); }
.eyny .band-soft{ background:var(--bg-2); padding-block:var(--s6); }

.eyny .sect-hd{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:var(--s3); margin-bottom:var(--s4);
}
.eyny .sect-hd h2{ font-size:24px; }
.eyny .sect-hd .en{
  font-size:12px; letter-spacing:.18em; color:var(--ink-3); text-transform:uppercase;
}

/* ---------- 4. 頁首 ---------- */
.eyny .hd{
  position:sticky; top:0; z-index:1030;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  box-shadow:var(--shadow);
}
.eyny .hd-in{
  height:var(--hd-h);
  display:flex; align-items:center; gap:var(--s3);
}
.eyny .hd-logo{ display:flex; align-items:center; flex:0 0 auto; }
.eyny .hd-logo img{ height:38px; width:auto; display:block; }
@media (min-width:768px){ .eyny .hd-logo img{ height:44px; } }

.eyny .hd-nav{ display:none; }
@media (min-width:1024px){
  .eyny .hd-nav{ display:flex; gap:var(--s1); margin-left:var(--s5); flex:1 1 auto; }
  .eyny .hd-nav a{
    display:block; padding:var(--s2) var(--s3); border-radius:var(--radius-s);
    color:var(--ink-2); font-size:16px; font-weight:600; line-height:1.2;
  }
  .eyny .hd-nav a span{ display:block; font-size:11px; color:var(--ink-3); letter-spacing:.08em; }
  .eyny .hd-nav a:hover{ background:var(--surface-2); color:var(--brand); }
  .eyny .hd-nav a.on{ color:var(--brand); background:var(--surface-2); }
}
.eyny .hd-right{ margin-left:auto; display:flex; align-items:center; gap:var(--s2); }

/* 登入後的餘額點數 */
.eyny .hd-bal{
  display:flex; align-items:center; gap:var(--s2);
  background:var(--surface-2); border:1px solid var(--line);
  border-radius:999px; padding:6px var(--s3); min-height:40px;
}
.eyny .hd-bal .lb{ font-size:12px; color:var(--ink-3); line-height:1.1; }
.eyny .hd-bal .vl{ font-size:16px; font-weight:700; color:var(--brand-deep); line-height:1.1; }
.eyny .hd-bal .rf{
  width:32px; height:32px; border:1px solid var(--line); border-radius:50%;
  background:var(--surface); color:var(--ink-2); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
@media (max-width:479px){
  .eyny .hd-bal{ padding:4px var(--s2); gap:var(--s1); }
  .eyny .hd-bal .lb{ display:none; }
}

/* ---------- 5. 按鈕 ---------- */
.eyny .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:44px; padding:0 var(--s5);
  border-radius:999px; border:1px solid transparent;
  font-size:16px; font-weight:700; line-height:1.2; cursor:pointer;
  transition:background .15s ease;
}
.eyny .btn-pri{ background:var(--brand); color:var(--on-brand); }
.eyny .btn-pri:hover{ background:var(--brand-deep); color:var(--on-brand); }
.eyny .btn-sec{ background:var(--surface); color:var(--brand-deep); border-color:var(--brand); }
.eyny .btn-sec:hover{ background:var(--surface-2); color:var(--brand-deep); }
.eyny .btn-ghost{ background:var(--surface-2); color:var(--ink-2); border-color:var(--line); }
.eyny .btn-sm{ min-height:44px; padding:0 var(--s4); font-size:15px; }
.eyny .btn-block{ width:100%; }
/* 兩顆按鈕一律同一行、左右各一 */
.eyny .btn-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s3); }
.eyny .btn-row .btn{ width:100%; }
/* 只有一顆送出鈕時置中,不要左邊空一半 */
.eyny .btn-one{ display:flex; justify-content:center; }
.eyny .btn-one .btn{ width:100%; max-width:320px; }

/* ---------- 6. 主視覺與公告 ---------- */
.eyny .hero{ margin-top:var(--s4); }
.eyny .hero-slide{
  border-radius:var(--radius); overflow:hidden; background:var(--bg-2);
  box-shadow:var(--shadow);
}
/* 主視覺素材是 1920x600(16:5),電腦版照原比例不裁;
   手機版收成 2:1,並靠左對齊避免把文案裁掉 */
.eyny .hero-slide img{ width:100%; display:block; aspect-ratio:16/5; object-fit:cover; }
@media (max-width:767px){
  .eyny .hero-slide img{ aspect-ratio:2/1; object-position:left center; }
}

.eyny .ticker{
  margin-top:var(--s4);
  display:flex; align-items:center; gap:var(--s3);
  background:var(--surface); border:1px solid var(--line);
  border-radius:999px; padding:var(--s2) var(--s4); min-height:44px; overflow:hidden;
}
.eyny .ticker .tag{
  flex:0 0 auto; font-size:13px; font-weight:700; color:var(--brand-deep);
  display:inline-flex; align-items:center; gap:6px;
}
.eyny .ticker .track{ flex:1 1 auto; overflow:hidden; }
.eyny .ticker .track ul{
  display:flex; gap:var(--s7); white-space:nowrap;
  animation:eynyMarquee 34s linear infinite;
}
.eyny .ticker .track a{ color:var(--ink-2); font-size:15px; }
@keyframes eynyMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .eyny .ticker .track ul{ animation:none; } }

/* ---------- 7. 遊戲分類切換 ---------- */
.eyny .cat{
  margin-top:var(--s5);
  display:grid; grid-template-columns:repeat(5,1fr); gap:var(--s2);
}
.eyny .cat button{
  appearance:none; border:1px solid var(--line); background:var(--surface);
  border-radius:var(--radius-s); padding:var(--s2) var(--s1);
  min-height:64px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  color:var(--ink-2); font-size:14px; font-weight:600; line-height:1.2;
}
.eyny .cat button i{ font-size:20px; line-height:1; color:var(--ink-3); }
.eyny .cat button.on{
  background:linear-gradient(180deg,var(--brand) 0%,var(--brand-deep) 100%);
  border-color:var(--brand-deep); color:var(--on-brand);
}
.eyny .cat button.on i{ color:var(--gold-soft); }
@media (min-width:768px){
  .eyny .cat{ gap:var(--s3); }
  .eyny .cat button{ min-height:72px; font-size:15px; }
  .eyny .cat button i{ font-size:24px; }
}

/* ---------- 8. 遊戲小卡 ---------- */
/* 小卡寬度全站一致(不因為某一區只有兩三張就變大),
   一行放不滿時整行置中,右邊不會單邊空一格 */
.eyny .cards{
  display:flex; flex-wrap:wrap; gap:var(--gap); justify-content:center;
}
.eyny .cards > .card{ width:calc((100% - var(--gap)) / 2); }
@media (min-width:520px){
  .eyny .cards > .card{ width:calc((100% - 2 * var(--gap)) / 3); }
}
@media (min-width:768px){
  .eyny .cards > .card{ width:calc((100% - 3 * var(--gap)) / 4); }
}
@media (min-width:1024px){
  .eyny .cards > .card{ width:calc((100% - 4 * var(--gap)) / 5); }
}

.eyny .card{
  display:flex; flex-direction:column; min-width:0;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); color:var(--ink);
  transition:transform .15s ease, box-shadow .15s ease;
}
.eyny .card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-2); color:var(--ink); }
/* 圖框固定 1:1。圖片絕對定位,才不會被素材自己的長寬比(例如 350x409)把框撐高,
   否則同一行的卡片會一高一矮。contain 保證不裁切、不變形。 */
.eyny .card .pic{
  position:relative;
  aspect-ratio:1/1;
  background:linear-gradient(160deg,#FBF3E7 0%,#F1E2CC 100%);
  overflow:hidden;
}
.eyny .card .pic img{
  position:absolute;
  top:var(--s2); left:var(--s2);
  width:calc(100% - var(--s2) * 2);
  height:calc(100% - var(--s2) * 2);
  object-fit:contain;
}
.eyny .card .tx{
  padding:var(--s3); border-top:1px solid var(--line-2);
  display:flex; flex-direction:column; gap:2px; min-height:70px;
}
.eyny .card .tx b{
  font-size:15px; font-weight:700; color:var(--ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.eyny .card .tx small{ font-size:12px; color:var(--ink-3); }
.eyny .card .go{
  margin-top:auto; font-size:13px; font-weight:700; color:var(--brand-deep);
  display:inline-flex; align-items:center; gap:4px;
}
@media (min-width:768px){
  .eyny .card .tx{ padding:var(--s3) var(--s4); min-height:76px; }
  .eyny .card .tx b{ font-size:16px; }
}
.eyny .pane{ display:none; }
.eyny .pane.on{ display:block; }

/* ---------- 9. 手機底部固定選單 ---------- */
.eyny .bnav{
  position:fixed; left:0; right:0; bottom:0; z-index:1040;
  background:var(--surface);
  border-top:1px solid var(--line);
  box-shadow:0 -2px 14px rgba(66,44,22,.10);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
.eyny .bnav ul{ display:grid; grid-template-columns:repeat(5,1fr); }
.eyny .bnav a{
  min-height:var(--bnav-h);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  color:var(--ink-2); font-size:12px; font-weight:600; line-height:1.2;
}
.eyny .bnav a i{ font-size:20px; line-height:1; color:var(--ink-3); }
.eyny .bnav a.on{ color:var(--brand); }
.eyny .bnav a.on i{ color:var(--brand); }
.eyny .bnav a.hi i{ color:var(--brand); }
@media (min-width:768px){ .eyny .bnav{ display:none; } }

/* ---------- 10. 會員中心 ---------- */
.eyny .mem-top{
  margin-top:var(--s5);
  background:linear-gradient(135deg,#FFF9F0 0%,#F7E9D5 100%);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:var(--s4);
  display:flex; align-items:center; gap:var(--s4); flex-wrap:wrap;
}
.eyny .mem-top .av{
  width:56px; height:56px; border-radius:50%;
  background:var(--brand); color:var(--on-brand);
  display:flex; align-items:center; justify-content:center; font-size:24px; flex:0 0 auto;
}
.eyny .mem-top .who{ min-width:0; }
.eyny .mem-top .who b{ font-size:19px; display:block; }
.eyny .mem-top .who span{ font-size:13px; color:var(--ink-3); }
.eyny .mem-top .bal{
  margin-left:auto; text-align:right;
  display:flex; flex-direction:column; align-items:flex-end;
}
.eyny .mem-top .bal .lb{ font-size:13px; color:var(--ink-3); }
.eyny .mem-top .bal .vl{ font-size:26px; font-weight:800; color:var(--brand-deep); line-height:1.2; }
@media (max-width:479px){
  .eyny .mem-top{ gap:var(--s3); }
  .eyny .mem-top .bal{ margin-left:0; width:100%; align-items:flex-start; text-align:left;
    border-top:1px dashed var(--line); padding-top:var(--s3); }
}

.eyny .quick{
  margin-top:var(--s4);
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap);
}
.eyny .quick a{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  min-height:80px; padding:var(--s3) var(--s2);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  color:var(--ink-2); font-size:14px; font-weight:700; text-align:center;
}
.eyny .quick a i{ font-size:22px; color:var(--brand); }
.eyny .quick a:hover{ border-color:var(--brand); color:var(--brand-deep); }

.eyny .mtabs{ margin-top:var(--s5); }
.eyny .mtabs ul{
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s2);
}
.eyny .mtabs a{
  display:flex; align-items:center; justify-content:center; gap:6px;
  min-height:44px; padding:0 var(--s2);
  background:var(--surface); border:1px solid var(--line); border-radius:999px;
  color:var(--ink-2); font-size:14px; font-weight:600; text-align:center;
}
.eyny .mtabs a.on{ background:var(--brand); border-color:var(--brand-deep); color:var(--on-brand); }
@media (min-width:768px){
  .eyny .mtabs ul{ grid-template-columns:repeat(8,1fr); gap:var(--s3); }
  .eyny .mtabs a{ font-size:15px; }
}

.eyny .panel{
  margin-top:var(--s5);
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;
}
.eyny .panel > .hd2{
  padding:var(--s4);
  border-bottom:1px solid var(--line-2);
  display:flex; align-items:center; justify-content:space-between; gap:var(--s3); flex-wrap:wrap;
}
.eyny .panel > .hd2 h2{ font-size:24px; }
.eyny .panel > .hd2 p{ font-size:14px; color:var(--ink-3); }
.eyny .panel > .bd{ padding:var(--s4); }

.eyny details.fold{ border-top:1px solid var(--line-2); }
.eyny details.fold:first-of-type{ border-top:0; }
.eyny details.fold > summary{
  list-style:none; cursor:pointer;
  padding:var(--s4); min-height:56px;
  display:flex; align-items:center; gap:var(--s3);
  font-size:17px; font-weight:700; color:var(--ink);
}
.eyny details.fold > summary::-webkit-details-marker{ display:none; }
.eyny details.fold > summary::after{
  content:"\F282"; font-family:"bootstrap-icons"; margin-left:auto;
  font-size:14px; color:var(--ink-3); transition:transform .15s ease;
}
.eyny details.fold[open] > summary::after{ transform:rotate(180deg); }
.eyny details.fold > .in{ padding:0 var(--s4) var(--s5); }
.eyny .tag-on,.eyny .tag-off{
  font-size:12px; font-weight:700; border-radius:999px; padding:3px 10px; line-height:1.6;
}
.eyny .tag-on{ background:#E7F4EC; color:var(--ok); }
.eyny .tag-off{ background:#FBEAE9; color:var(--err); }

/* 表單 */
.eyny .field{ margin-top:var(--s4); }
.eyny .field:first-child{ margin-top:0; }
.eyny .field > label{
  display:block; font-size:14px; font-weight:700; color:var(--ink-2); margin-bottom:6px;
}
.eyny .field .hint{ font-size:13px; color:var(--ink-3); margin-top:6px; }
.eyny .form-control,
.eyny input[type=text].form-control,
.eyny input[type=password].form-control,
.eyny input[type=number].form-control,
.eyny select.form-control{
  width:100%; min-height:46px;
  padding:0 var(--s3);
  background:var(--surface); color:var(--ink);
  border:1px solid var(--line); border-radius:var(--radius-s);
  font-size:16px;
}
.eyny textarea.form-control{ padding:var(--s3); min-height:96px; }
.eyny .form-control::placeholder{ color:#75604E; }
.eyny .form-control:focus{ outline:2px solid var(--brand); outline-offset:1px; border-color:var(--brand); }
.eyny .grid-2{ display:grid; grid-template-columns:1fr; gap:var(--s3); }
@media (min-width:768px){ .eyny .grid-2{ grid-template-columns:1fr 1fr; gap:var(--s4); } }
.eyny .file-line{
  display:flex; align-items:center; gap:var(--s3);
  border:1px dashed var(--line); border-radius:var(--radius-s); padding:var(--s3);
}
.eyny .file-line input[type=file]{ font-size:14px; color:var(--ink-2); max-width:100%; }
.eyny .note-list{
  margin-top:var(--s4); padding:var(--s3) var(--s4);
  background:var(--surface-2); border:1px solid var(--line-2); border-radius:var(--radius-s);
}
.eyny .note-list li{
  font-size:14px; color:var(--ink-2); padding-left:var(--s3); position:relative;
}
.eyny .note-list li::before{
  content:""; position:absolute; left:0; top:.7em;
  width:5px; height:5px; border-radius:50%; background:var(--brand);
}
.eyny .field > label a{ font-size:13px; font-weight:600; margin-left:var(--s2); }

/* 唯讀對照列 */
.eyny .dl{ display:grid; grid-template-columns:1fr; gap:0 var(--s5); }
@media (min-width:640px){ .eyny .dl{ grid-template-columns:1fr 1fr; } }
.eyny .dl .row2{
  display:flex; align-items:center; gap:var(--s3);
  padding:var(--s2) 0; border-bottom:1px dashed var(--line-2); min-height:44px;
}
.eyny .dl dt{ font-size:14px; color:var(--ink-3); flex:0 0 96px; margin:0; }
.eyny .dl dd{ margin:0; font-size:16px; font-weight:600; color:var(--ink); }

/* 表格式紀錄 */
.eyny .tbl-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.eyny table.tbl{ width:100%; border-collapse:collapse; min-width:520px; }
.eyny table.tbl th,.eyny table.tbl td{
  padding:var(--s3); text-align:left; font-size:15px;
  border-bottom:1px solid var(--line-2); white-space:nowrap;
}
.eyny table.tbl th{ background:var(--surface-2); color:var(--ink-2); font-size:14px; font-weight:700; }
.eyny table.tbl td.num{ text-align:right; font-variant-numeric:tabular-nums; }
.eyny .empty{ padding:var(--s6) var(--s4); text-align:center; color:var(--ink-3); font-size:15px; }

/* ---------- 11. 彈窗:約佔螢幕 7.5 成,不滿版 ---------- */
.eyny .modal-dialog{
  max-width:75vw; width:75vw;
  margin:10vh auto;
}
.eyny .modal-content{
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--surface); color:var(--ink); box-shadow:var(--shadow-2);
  max-height:75vh; overflow:auto;
}
@media (max-width:767px){
  /* 手機:寬 78%、高最多 75% —— Owner 指定「七成五就好,不要滿版」 */
  .eyny .modal-dialog{ max-width:78vw; width:78vw; margin:10vh auto; }
}
@media (min-width:1024px){
  .eyny .modal-dialog{ max-width:460px; width:36vw; }
}
.eyny .modal-header{
  padding:var(--s4); border-bottom:1px solid var(--line-2);
  display:flex; align-items:center; justify-content:space-between; gap:var(--s3);
}
.eyny .modal-header .modal-title{ font-size:19px; font-weight:700; margin:0; }
.eyny .modal-header .close{
  appearance:none; border:0; background:var(--surface-2); color:var(--ink-2);
  width:36px; height:36px; border-radius:50%; font-size:20px; line-height:1; cursor:pointer;
  flex:0 0 auto;
}
.eyny .modal-body{ padding:var(--s4); }
.eyny .modal-footer{
  padding:var(--s4); border-top:1px solid var(--line-2);
  display:flex; gap:var(--s3);
}
.eyny .modal-footer > *{ flex:1 1 0; }
.eyny .alert{ border-radius:var(--radius-s); padding:var(--s3); font-size:15px; }
.eyny .alert-danger{ background:#FBEAE9; color:var(--err); border:1px solid #F0C8C5; }
.eyny .alert-success{ background:#E7F4EC; color:var(--ok); border:1px solid #C3E3D0; }
.eyny .login-else h4{ font-size:14px; color:var(--ink-3); text-align:center; margin:var(--s4) 0 var(--s2); }
.eyny .login-else .log-img img{ height:40px; width:auto; }
.eyny .login-else .col-sm-12{ display:flex; gap:var(--s3); justify-content:center; }
.eyny .login-else .hr{ display:none; }
.eyny .vcode-row{ display:flex; align-items:center; gap:var(--s3); }
.eyny .vcode-row img{ height:46px; width:auto; border-radius:var(--radius-s); border:1px solid var(--line); cursor:pointer; }
.eyny .blockUI.blockMsg{ border-radius:var(--radius) !important; }

/* ---------- 10-1. 會員中心:標題帶與任務卡 ---------- */
.eyny .pghd{
  margin-top:var(--s5);
  display:flex; align-items:baseline; gap:var(--s3);
}
.eyny .pghd h1{ font-size:24px; font-weight:800; color:var(--ink); }
.eyny .pghd .back{
  margin-left:auto; font-size:14px; color:var(--ink-3);
  display:inline-flex; align-items:center; gap:4px; min-height:44px;
}
.eyny .pghd .back:hover{ color:var(--brand-deep); }

.eyny .task{
  margin-top:var(--s4);
  background:var(--surface); border:1px solid var(--brand-soft);
  border-radius:var(--radius); padding:var(--s4);
}
.eyny .task h2{ font-size:19px; font-weight:800; color:var(--ink); }
.eyny .task .sub{ margin-top:var(--s2); font-size:14px; color:var(--ink-2); }
.eyny .task .pbar{
  margin-top:var(--s3); height:6px; border-radius:99px;
  background:var(--bg-2); overflow:hidden;
}
.eyny .task .pbar i{ display:block; height:100%; background:var(--brand); border-radius:99px; }
.eyny .task .tsteps{ margin-top:var(--s3); list-style:none; }
.eyny .task .tsteps li{
  display:flex; align-items:center; gap:var(--s3);
  padding:var(--s3) 0; border-top:1px solid var(--line-2);
}
.eyny .task .tsteps li:first-child{ border-top:0; }
.eyny .task .tsteps .tt{ min-width:0; flex:1 1 auto; }
.eyny .task .tsteps .tt b{ display:block; font-size:16px; color:var(--ink); }
.eyny .task .tsteps .tt span{ display:block; font-size:13px; color:var(--ink-3); margin-top:2px; }
.eyny .task .tsteps li .btn{ flex:0 0 auto; padding:0 var(--s4); }
.eyny .task .tsteps li.done .tt b::before{
  content:"\2713"; color:var(--ok); font-weight:800; margin-right:6px;
}
.eyny .task .tsteps li.done .tt b{ color:var(--ink-3); }

/* 閃一下:被鎖住的入口點下去時,讓人看得到是這張卡在擋 */
.eyny .task.flash{ animation:eynyFlash 1.1s ease-out 1; }
@keyframes eynyFlash{
  0%{ box-shadow:0 0 0 0 rgba(196,81,13,.45); }
  70%{ box-shadow:0 0 0 12px rgba(196,81,13,0); }
  100%{ box-shadow:0 0 0 0 rgba(196,81,13,0); }
}

/* 鎖住的入口:看得出來是鎖著的,但仍然可點(點了帶回任務卡) */
.eyny .quick a.lockd{ color:var(--ink-3); border-style:dashed; position:relative; }
.eyny .quick a.lockd i:not(.lk){ color:var(--ink-3); }
.eyny .quick a.lockd .lk{ position:absolute; top:6px; right:8px; font-size:12px; color:var(--ink-3); }
.eyny .btn.btn-locked{ background:var(--ink-3); border-color:var(--ink-3); }
.eyny .btn.btn-locked:hover{ background:var(--ink-2); border-color:var(--ink-2); }

@media (max-width:479px){
  .eyny .task .tsteps li{ flex-wrap:wrap; }
  .eyny .task .tsteps li .btn{ width:100%; }
}