:root{
  --navy:#1b2a4a; --navy2:#2b3f66; --gold:#e8b955; --gold2:#c4922f; --gold-soft:#f3e2bd;
  --ink:#f3ecd8; --ink2:#d9cfb4; --mut:#a9b0c6;
  --bg:#0e1330; --card:#1c2444; --card2:#151b38; --line:#2c3560; --line2:#3a4573;
  --ok:#37c98d; --bad:#e0574d;
  --serif:"Noto Serif TC","Songti TC","PMingLiU","MingLiU",serif;
  --sans:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);color:var(--ink);min-height:100vh;
  background:
    radial-gradient(720px 380px at 10% -6%, rgba(232,185,85,.18), transparent 60%),
    radial-gradient(680px 420px at 100% 2%, rgba(91,141,239,.16), transparent 58%),
    linear-gradient(160deg,#182150,#0e1330 60%);
  background-attachment:fixed}
a{color:var(--gold);text-decoration:none}
.wrap{max-width:920px;margin:0 auto;padding:26px 18px 60px}

/* Header */
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;
  background:rgba(12,16,36,.85);border-bottom:1px solid rgba(232,185,85,.4);position:sticky;top:0;z-index:10}
header h1{font-family:var(--serif);font-size:19px;letter-spacing:2px;color:#fff2cf;text-shadow:0 0 16px rgba(232,185,85,.4);display:flex;align-items:center;gap:10px}
header .sp{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink2)}

/* Card / plaque */
.card{position:relative;border-radius:16px;padding:22px;margin-top:18px;
  background:linear-gradient(162deg,#232d54,#141a38 82%);
  box-shadow:0 0 0 1px #0a0e22,0 0 0 2px rgba(232,185,85,.5),0 0 0 3px #0a0e22,inset 0 1px 0 rgba(255,255,255,.06),0 18px 44px rgba(0,0,0,.5)}
.card h2{font-family:var(--serif);font-size:18px;letter-spacing:1px;color:#fff2cf;margin-bottom:6px}
.muted{color:var(--mut);font-size:13px}

/* Buttons */
button,.btn{font-family:var(--serif);font-weight:800;letter-spacing:1px;font-size:15px;color:#2a1e06;cursor:pointer;border:0;border-radius:11px;padding:11px 22px;
  background:linear-gradient(180deg,#fff2c8,#e8b955 45%,#b5851f);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 6px 16px rgba(232,185,85,.35),0 0 0 1px #7a5410;transition:transform .12s,box-shadow .16s}
button:hover,.btn:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 10px 24px rgba(232,185,85,.5),0 0 0 1px #7a5410}
button.ghost{background:linear-gradient(180deg,#2c3760,#182040);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 1px rgba(232,185,85,.5)}
button.sm{padding:6px 12px;font-size:13px;border-radius:8px}
button:disabled{opacity:.5;cursor:not-allowed;transform:none}

/* Inputs */
label{display:block;font-size:13px;color:var(--ink2);margin:10px 0 4px;font-weight:700}
input,select{width:100%;padding:10px 12px;border-radius:9px;border:1px solid rgba(232,185,85,.35);background:#101632;color:var(--ink);font-size:14px;font-family:inherit}
input[type=checkbox]{width:auto}

/* Login */
.login-box{max-width:380px;margin:8vh auto 0}
.brand-big{text-align:center;margin-bottom:6px}
.brand-big .logo{font-size:44px}
.brand-big h1{font-family:var(--serif);font-size:26px;letter-spacing:3px;color:transparent;background:linear-gradient(180deg,#fff6dd,#e8b955 60%,#c48f22);-webkit-background-clip:text;background-clip:text;text-shadow:0 2px 20px rgba(232,185,85,.4)}
.brand-big .sub{color:var(--gold-soft);letter-spacing:4px;font-size:12px;margin-top:4px;font-family:var(--serif)}
.err{color:var(--bad);font-size:13.5px;margin-top:10px;min-height:1.2em}

/* Launcher grid */
.sys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:6px}
.sys{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px 18px;border-radius:16px;cursor:pointer;color:var(--ink);text-align:left;
  background:linear-gradient(165deg,#2a3660,#161d3e 82%);border:0;
  box-shadow:0 0 0 1px #0a0e22,0 0 0 2px rgba(232,185,85,.55),0 0 0 3px #0a0e22,inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.5);
  transition:transform .15s,box-shadow .18s}
.sys:hover{transform:translateY(-4px);box-shadow:0 0 0 1px #0a0e22,0 0 0 2px var(--gold),0 0 0 3px #0a0e22,inset 0 1px 0 rgba(255,255,255,.08),0 20px 40px rgba(0,0,0,.6),0 0 26px rgba(232,185,85,.3)}
.sys .ico{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;font-size:34px;
  background:radial-gradient(circle at 38% 28%,#3a4a82,#1a2246);box-shadow:0 0 0 2px rgba(232,185,85,.5),inset 0 2px 6px rgba(255,255,255,.2)}
.sys .nm{font-family:var(--serif);font-weight:800;font-size:17px;color:#fff2cf;letter-spacing:1px}
.sys .go{font-size:12.5px;color:var(--gold-soft);font-weight:700}
.sys.locked{cursor:not-allowed;filter:saturate(.5) brightness(.7);box-shadow:0 0 0 1px #05070f,0 0 0 2px rgba(120,128,150,.4),0 0 0 3px #05070f,inset 0 0 20px rgba(0,0,0,.5)}
.sys.locked:hover{transform:none;box-shadow:0 0 0 1px #05070f,0 0 0 2px rgba(120,128,150,.4),0 0 0 3px #05070f}
.sys.locked .go{color:var(--mut)}

/* Tables (admin) */
table{width:100%;border-collapse:collapse;margin-top:10px;font-size:13.5px}
th,td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{color:var(--gold-soft);font-family:var(--serif);font-weight:700}
.tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:800;background:var(--card2);border:1px solid var(--line2);color:var(--ink2)}
.tag.on{background:rgba(55,201,141,.16);color:#bff0d8;border-color:rgba(55,201,141,.4)}
.row-actions{display:flex;gap:6px;flex-wrap:wrap}
.ent-cell{display:flex;align-items:center;gap:6px}
.ent-cell input[type=date]{width:140px;padding:5px 7px}
.chkwrap{display:flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap}
hr{border:0;border-top:1px solid var(--line);margin:16px 0}

.hidden{display:none}

/* ---- 後台使用者：卡片式（取代過寬表格，操作永遠可見、內容自動換行） ---- */
#userTable{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.ucard{border:1px solid rgba(232,185,85,.28);border-radius:14px;padding:14px 16px;background:linear-gradient(160deg,rgba(255,255,255,.04),rgba(0,0,0,.12))}
.ucard-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.ucard-id{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.uname{font-family:var(--serif);font-weight:800;font-size:15px;color:#fff2cf}
input.uname{width:auto;min-width:110px;max-width:180px;padding:6px 10px;background:rgba(255,255,255,.04);border:1px dashed rgba(232,185,85,.35);border-radius:8px}
input.uname:focus{border-style:solid;outline:none;border-color:var(--gold,#e8b955)}
.ucard .dn{width:auto;min-width:120px;max-width:200px;padding:6px 10px}
.ucard .row-actions{display:flex;gap:6px;flex-wrap:wrap}
.ucard-ents{margin-top:12px;padding-top:11px;border-top:1px solid var(--line)}
.ents-lbl{display:block;font-size:12.5px;color:var(--mut);margin-bottom:8px}
.ent-list{display:flex;flex-wrap:wrap;gap:8px 10px;margin-bottom:10px}
.ent-item{display:flex;align-items:center;gap:5px}
.entchip{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:999px;border:1px solid var(--line2);background:var(--card2);color:var(--ink2);font-size:13px;font-weight:700;cursor:pointer;user-select:none;white-space:nowrap;transition:all .12s}
.entchip:hover{border-color:var(--gold)}
.entchip.on{background:rgba(55,201,141,.16);border-color:rgba(55,201,141,.55);color:#bff0d8}
.entchip.lock{opacity:.6;cursor:default;background:rgba(232,185,85,.12);border-color:rgba(232,185,85,.35);color:var(--gold-soft)}
.entchip.lock:hover{border-color:rgba(232,185,85,.35)}
.ent-item .ent-exp{width:128px;padding:5px 8px;font-size:12.5px}
@media(max-width:600px){ .ucard-head{align-items:flex-start} .ent-item .ent-exp{width:120px} }

/* 會員卡：身份、備註、密碼 */
.ucard-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:10px;font-size:12.5px;color:var(--ink2)}
.meta-item{display:inline-flex;align-items:center;gap:6px}
.pwval{color:var(--gold-soft);font-family:"Courier New",monospace;font-size:13.5px;letter-spacing:.5px}
.ucard .tier{width:auto;min-width:92px;padding:5px 8px;font-size:12.5px}
.ucard .note{width:auto;min-width:160px;max-width:240px;padding:5px 8px;font-size:12.5px}

/* ============================================================
   ✨ 精品質感升級（登入＋選單）— 毛玻璃・流動金光・光澤
   ============================================================ */
/* Lovart 電影感金龍背景圖 + 暗色疊層（維持 UI 可讀）+ 細噪點 */
body{background:
  linear-gradient(180deg, rgba(9,13,30,.50), rgba(9,13,30,.30) 42%, rgba(9,13,30,.68)),
  url("assets/bg.jpg") center top / cover no-repeat fixed,
  linear-gradient(160deg,#12183a,#0a0e26)}
body::before{content:"";position:fixed;inset:-25%;z-index:-2;pointer-events:none;
  background:radial-gradient(620px 620px at 28% 30%, rgba(232,185,85,.12), transparent 60%),
            radial-gradient(520px 520px at 72% 72%, rgba(91,141,239,.12), transparent 62%);
  filter:blur(22px);animation:pfx-drift 20s ease-in-out infinite alternate}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  box-shadow:inset 0 0 240px rgba(4,7,20,.6);
  background:repeating-linear-gradient(45deg, rgba(255,255,255,.012) 0 2px, transparent 2px 6px)}
@keyframes pfx-drift{0%{transform:translate(-3%,-2%) scale(1)}100%{transform:translate(3%,2%) scale(1.08)}}

/* 玻璃卡片 */
.card{background:linear-gradient(162deg, rgba(40,52,92,.60), rgba(20,26,58,.52));
  backdrop-filter:blur(16px) saturate(1.15); -webkit-backdrop-filter:blur(16px) saturate(1.15);
  box-shadow:0 0 0 1px rgba(232,185,85,.5), inset 0 1px 0 rgba(255,255,255,.10), 0 24px 60px rgba(0,0,0,.5);
  animation:pfx-up .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes pfx-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* 登入頁品牌徽章 + 標題光暈 */
.login-box{animation:pfx-up .6s cubic-bezier(.2,.8,.2,1) both}
/* 白龍 logo 直接置於背景，後方柔和聚光光暈（無圓框） */
.brand-big .logo{position:relative;display:flex;justify-content:center;align-items:flex-end;width:auto;height:auto;background:none;box-shadow:none;border-radius:0;margin:0 auto 12px}
.brand-big .logo::before{content:"";position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);width:230px;height:230px;border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(circle, rgba(214,228,255,.30), rgba(232,185,85,.10) 42%, transparent 70%);filter:blur(4px)}
.brand-big h1{animation:pfx-glow 3.6s ease-in-out infinite}
@keyframes pfx-glow{0%,100%{filter:drop-shadow(0 0 10px rgba(232,185,85,.22))}50%{filter:drop-shadow(0 0 22px rgba(232,185,85,.5))}}

/* 輸入框金色聚焦光環 */
input:focus,select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(232,185,85,.22), 0 0 16px rgba(232,185,85,.15)}

/* 按鈕：滑過金光掃過 */
button,.btn{position:relative;overflow:hidden}
button::after,.btn::after{content:"";position:absolute;top:0;left:-75%;width:45%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);transition:left .6s ease}
button:hover::after,.btn:hover::after{left:135%}

/* 系統磚：玻璃 + 光澤掃過 + 依序淡入 */
.sys{overflow:hidden;background:linear-gradient(165deg, rgba(42,54,96,.58), rgba(22,29,62,.5));
  backdrop-filter:blur(14px) saturate(1.1); -webkit-backdrop-filter:blur(14px) saturate(1.1);
  animation:pfx-up .5s cubic-bezier(.2,.8,.2,1) both}
.sys::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);transform:skewX(-18deg);transition:left .55s ease}
.sys:hover::after{left:135%}
.sys .ico{box-shadow:0 0 0 2px rgba(232,185,85,.5), 0 6px 18px rgba(0,0,0,.4), inset 0 2px 6px rgba(255,255,255,.2)}
.sys-grid .sys:nth-child(1){animation-delay:.04s}.sys-grid .sys:nth-child(2){animation-delay:.09s}
.sys-grid .sys:nth-child(3){animation-delay:.14s}.sys-grid .sys:nth-child(4){animation-delay:.19s}
.sys-grid .sys:nth-child(5){animation-delay:.24s}.sys-grid .sys:nth-child(6){animation-delay:.29s}
.sys-grid .sys:nth-child(7){animation-delay:.34s}.sys-grid .sys:nth-child(8){animation-delay:.39s}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
/* 品牌 logo 圖（金色龍紋）置入金環徽章 */
.brand-big .logo img{position:relative;z-index:1;width:122px;height:122px;object-fit:contain;display:block;filter:drop-shadow(0 4px 18px rgba(160,190,255,.35))}
/* 主頁三大分類 */
.cat{margin-top:26px}
.cat:first-child{margin-top:2px}
.cat-h{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding-bottom:10px;
  font-family:var(--serif);font-size:16px;font-weight:800;letter-spacing:3px;color:var(--gold-soft);
  border-bottom:1px solid rgba(232,185,85,.22)}
.cat-ic{font-size:20px;filter:drop-shadow(0 0 8px rgba(232,185,85,.45))}
.cat .sys-grid{margin-top:0}
/* 左上角小標題白龍 logo */
header h1 .hlogo{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(180,200,255,.45))}
/* 專屬精品圖示（實心深藍底圖，圓角方塊＋金邊框） */
.sys .ico.img{width:72px;height:72px;background:none;border-radius:15px;padding:0;overflow:hidden;
  box-shadow:0 0 0 1.5px rgba(232,185,85,.55), inset 0 1px 0 rgba(255,255,255,.12), 0 6px 16px rgba(0,0,0,.5)}
.sys .ico.img img{width:100%;height:100%;object-fit:cover;display:block;filter:none}
/* ===== 全幅卡片（圖內含系統名稱，鋪滿整格）===== */
.sys.card-img{position:relative;padding:0;overflow:hidden;border-radius:16px;display:block;border:0;
  aspect-ratio:1264/848;background:#0e1330;
  box-shadow:0 0 0 1px #0a0e22, 0 12px 30px rgba(0,0,0,.55);transition:transform .16s,box-shadow .2s}
.sys.card-img .cardimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.sys.card-img:hover{transform:translateY(-5px);box-shadow:0 0 0 1px rgba(232,185,85,.65),0 22px 48px rgba(0,0,0,.6),0 0 32px rgba(232,185,85,.3)}
.sys.card-img:hover .cardimg{transform:scale(1.045)}
.sys.card-img .go-badge{position:absolute;left:12px;bottom:12px;z-index:3;font-size:12.5px;color:#2a1e06;font-weight:800;font-family:var(--serif);
  background:linear-gradient(180deg,#ffe9a8,#e8b955);padding:6px 13px;border-radius:999px;
  box-shadow:0 3px 12px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.6);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}
.sys.card-img:hover .go-badge{opacity:1;transform:none}
.sys.card-img .exp{display:block;font-size:10px;font-weight:700;color:#5a4410;margin-top:1px}
.sys.card-img .lockmask{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:rgba(6,9,20,.62);color:#c9cfe0;font-size:12.5px;font-weight:800;letter-spacing:1px}
.sys.card-img .lockmask .lockico{font-size:30px;filter:drop-shadow(0 0 10px rgba(0,0,0,.6))}
.sys.card-img.locked{cursor:not-allowed}
.sys.card-img.locked .cardimg{filter:saturate(.35) brightness(.45)}
.sys.card-img.locked:hover{transform:none;box-shadow:0 0 0 1px #0a0e22,0 12px 30px rgba(0,0,0,.55)}
/* 即將公開：不鎖灰、保留金色質感，只蓋一層薄紗＋金字標示 */
.sys.card-img.soon{cursor:default}
.sys.card-img.soon .cardimg{filter:saturate(.7) brightness(.6)}
.sys.card-img.soon:hover{transform:none;box-shadow:0 0 0 1px #0a0e22,0 12px 30px rgba(0,0,0,.55)}
.sys.card-img.soon:hover .cardimg{transform:none}
.lockmask.soonmask{background:rgba(6,9,20,.5);color:#f2dda2;text-shadow:0 2px 8px rgba(0,0,0,.7)}
.sys.locked.soon{filter:saturate(.75) brightness(.85)}
.sys.locked.soon .go{color:var(--gold-soft)}
/* 分類快速跳轉列（黏在標題列下方，點一下直接到那一區）*/
.catnav{position:sticky;top:var(--hdr-h,57px);z-index:9;display:flex;gap:8px;overflow-x:auto;
  padding:10px 18px;background:rgba(9,12,28,.88);border-bottom:1px solid rgba(232,185,85,.18);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);scrollbar-width:none}
.catnav::-webkit-scrollbar{display:none}
.cnav-chip{flex:0 0 auto;font-family:var(--sans);font-size:12.5px;font-weight:700;letter-spacing:.5px;
  color:var(--ink2);background:rgba(35,45,84,.55);border:1px solid rgba(232,185,85,.28);border-radius:999px;
  padding:6px 13px;cursor:pointer;white-space:nowrap;box-shadow:none;transition:background .15s,color .15s,border-color .15s}
.cnav-chip::after{display:none}
.cnav-chip:hover{border-color:var(--gold);color:#fff2cf;transform:none;box-shadow:none}
.cnav-chip.on{background:linear-gradient(180deg,#ffe9a8,#e8b955);color:#2a1e06;border-color:#7a5410;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
/* 捲到定位時不要被標題列＋跳轉列蓋住 */
.cat{scroll-margin-top:calc(var(--hdr-h,57px) + 74px)}

/* 後台篩選鈕 */
.fgroup{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.flabel{font-size:12.5px;color:var(--mut);font-weight:700}
.fbtn{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--ink2);cursor:pointer;border:1px solid var(--line2);
  background:var(--card2);border-radius:999px;padding:5px 13px;letter-spacing:0;box-shadow:none;transition:all .12s}
.fbtn:hover{border-color:var(--gold);transform:none;box-shadow:none}
.fbtn.on{background:linear-gradient(180deg,#ffe9a8,#e8b955);color:#2a1e06;border-color:#7a5410;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.fbtn::after{display:none}

/* 素材庫：一鍵產生保護連結的結果卡 */
.mres{margin:10px 0 14px;padding:12px 14px;border:1px solid rgba(55,201,141,.45);background:rgba(55,201,141,.08);border-radius:10px}
.mres-t{font-weight:700;color:#d9f5e8;margin-bottom:8px}
.mres-l{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.mres-l code,.m-link{background:rgba(0,0,0,.35);border:1px solid var(--line2);border-radius:7px;padding:5px 9px;color:#fff2cf;font-size:13px}

/* 登入頁：LINE Login */
.line-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;
  background:#06C755;color:#fff;text-decoration:none;font-weight:800;font-size:15.5px;
  padding:13px;border-radius:9px;letter-spacing:.5px;border:0;transition:filter .12s}
.line-btn:hover,.line-btn:focus-visible{filter:brightness(1.08);outline:none}
.line-btn svg{width:21px;height:21px;flex:none}
.or{display:flex;align-items:center;gap:10px;margin:16px 0 4px;color:var(--mut);font-size:12px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line2)}

/* ===== 後台：概覽數字＋分頁式版面（一次只看一件事，不用一路往下捲）===== */
.adm-top{position:sticky;top:var(--hdr-h,57px);z-index:9;padding:14px 18px 0;
  background:rgba(9,12,28,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(232,185,85,.2)}
.adm-inner{max-width:920px;margin:0 auto}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin-bottom:12px}
.stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:12px;cursor:pointer;
  background:linear-gradient(170deg,rgba(40,52,92,.55),rgba(20,26,58,.5));border:1px solid rgba(232,185,85,.22);
  box-shadow:none;transition:border-color .15s,transform .12s}
.stat::after{display:none}
.stat:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:none}
.stat-n{font-family:var(--serif);font-size:23px;font-weight:800;line-height:1.1;color:#fff2cf;text-shadow:0 0 14px rgba(232,185,85,.35)}
.stat-l{font-size:11.5px;font-weight:700;letter-spacing:.5px;color:var(--mut)}
.stat.alert .stat-n{color:#ffd08a}
.stat.alert{border-color:rgba(232,185,85,.75);background:linear-gradient(170deg,rgba(232,185,85,.18),rgba(20,26,58,.5))}
.adm-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:11px;scrollbar-width:none}
.adm-tabs::-webkit-scrollbar{display:none}
.atab{flex:0 0 auto;font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.5px;color:var(--ink2);
  background:rgba(35,45,84,.55);border:1px solid rgba(232,185,85,.28);border-radius:999px;padding:7px 15px;cursor:pointer;
  white-space:nowrap;box-shadow:none;transition:background .15s,color .15s,border-color .15s}
.atab::after{display:none}
.atab:hover{border-color:var(--gold);color:#fff2cf;transform:none;box-shadow:none}
.atab.on{background:linear-gradient(180deg,#ffe9a8,#e8b955);color:#2a1e06;border-color:#7a5410;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.tabpane[hidden]{display:none}
.tabpane{animation:pfx-up .3s cubic-bezier(.2,.8,.2,1) both}
/* 收合式：說明 ⓘ／新增夥伴 */
.tip,.add-box{margin:12px 0;border:1px solid rgba(232,185,85,.22);border-radius:11px;background:rgba(232,185,85,.05)}
.tip>summary,.add-box>summary{cursor:pointer;padding:9px 14px;font-size:13px;font-weight:700;color:var(--gold-soft);
  list-style:none;user-select:none}
.tip>summary::-webkit-details-marker,.add-box>summary::-webkit-details-marker{display:none}
.tip>summary::before,.add-box>summary::before{content:"▸ ";color:var(--gold)}
.tip[open]>summary::before,.add-box[open]>summary::before{content:"▾ "}
.tip>p{margin:0;padding:0 14px 12px;font-size:12.5px;line-height:1.8;color:var(--mut)}
.add-box[open]{background:rgba(232,185,85,.07)}
.add-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;padding:4px 14px 14px;align-items:end}
.add-grid .wide{grid-column:span 2}
.add-grid .act{display:flex;align-items:flex-end}
.add-grid .act button{width:100%}
.add-box>.muted{padding:0 14px 12px}
.mat-add{padding:4px 0 12px}
.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 8px}
.toolbar input{max-width:340px}
.filters{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.sub-h{font-family:var(--serif);color:#fff2cf;font-size:15px;margin:20px 0 6px;
  padding-bottom:7px;border-bottom:1px solid rgba(232,185,85,.18)}
.all-open{color:var(--gold-soft);font-weight:800}

/* ===== 夥伴卡片：姓名為主、帳號密碼為輔、開通晶片依分類分組 ===== */
.ucard{margin-bottom:14px}
.ucard.off{opacity:.62}
.ucard-head{align-items:flex-start;flex-wrap:nowrap;gap:12px}
.uav{flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:19px;font-weight:800;color:#2a1e06;
  background:linear-gradient(180deg,#ffe9a8,#d8a63f);box-shadow:0 2px 10px rgba(0,0,0,.4)}
.uav.adm{background:linear-gradient(180deg,#cfe0ff,#7d9bd6);color:#12203f}
.uid{flex:1 1 auto;min-width:0}
.ucard .dn{width:100%;max-width:260px;font-family:var(--serif);font-size:16.5px;font-weight:800;color:#fff2cf;
  padding:4px 8px;background:transparent;border:1px solid transparent;border-radius:8px}
.ucard .dn:hover{border-color:rgba(232,185,85,.3);background:rgba(255,255,255,.04)}
.ucard .dn:focus{border-color:var(--gold);background:rgba(255,255,255,.06);outline:none}
.uid-sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:3px;font-size:12px;color:var(--mut)}
.uid-sub .fl{color:var(--mut);font-weight:700;letter-spacing:.5px}
.ucard input.uname{font-family:"Courier New",monospace;font-size:12.5px;font-weight:700;color:var(--ink2);
  width:auto;min-width:104px;max-width:150px;padding:3px 8px;background:rgba(255,255,255,.04);
  border:1px solid transparent;border-radius:7px}
.ucard input.uname:hover{border-color:rgba(232,185,85,.3)}
.ucard input.uname:focus{border-color:var(--gold);outline:none}
.uhead-r{flex:0 0 auto;display:flex;align-items:center;gap:8px}
/* 「⋯」更多操作：平常收著，點開才出現危險操作 */
.umenu{position:relative}
.umenu>summary{list-style:none;cursor:pointer;padding:2px 9px;border-radius:8px;font-size:17px;font-weight:800;
  color:var(--gold-soft);border:1px solid rgba(232,185,85,.3);user-select:none;line-height:1.3}
.umenu>summary::-webkit-details-marker{display:none}
.umenu>summary:hover{border-color:var(--gold);background:rgba(232,185,85,.1)}
.umenu-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:6;display:flex;flex-direction:column;gap:6px;
  padding:9px;min-width:146px;border-radius:11px;background:#141a38;
  border:1px solid rgba(232,185,85,.4);box-shadow:0 14px 34px rgba(0,0,0,.6)}
.umenu-pop button{width:100%;text-align:left}
.umenu-pop .danger{color:#ffb3b3;border-color:rgba(255,120,120,.4)}
.umenu-pop .danger:hover{border-color:#ff8a8a;background:rgba(255,90,90,.12)}
/* 開通區：標題列＋依分類分組 */
.ents-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ents-bar .ents-lbl{margin:0;font-size:12.5px;font-weight:700;color:var(--ink2)}
.ents-bar .ent-count{color:var(--gold-soft);font-size:15px;font-family:var(--serif)}
.ents-hint{font-size:11.5px;color:var(--mut)}
.ents-hint b{color:var(--gold-soft)}
/* 晶片存檔中／存好了的即時回饋 */
.entchip.saving{opacity:.55}
.entchip.saved{animation:chip-saved .9s ease}
@keyframes chip-saved{0%{box-shadow:0 0 0 0 rgba(55,201,141,.7)}100%{box-shadow:0 0 0 9px rgba(55,201,141,0)}}
.ent-cats{display:flex;flex-direction:column;gap:9px}
.ent-cat{display:grid;grid-template-columns:96px 1fr;align-items:start;gap:10px}
.ent-cat-l{font-size:12px;font-weight:700;color:var(--mut);padding-top:7px;letter-spacing:.5px;white-space:nowrap}
.ent-cat .ent-list{margin:0}
.ucard-meta{margin-top:9px}
.ucard-meta .note{flex:1;min-width:140px;max-width:280px}
@media(max-width:600px){
  .ent-cat{grid-template-columns:1fr;gap:4px}
  .ent-cat-l{padding-top:0}
  .ucard .dn{max-width:100%}
}
@media (max-width:560px){
  .add-grid .wide{grid-column:span 1}
  .stat-n{font-size:20px}
}

/* 登入頁備註（原始帳密規則、忘記密碼怎麼辦）*/
.login-note{margin-top:14px;padding:12px 14px;border-radius:10px;font-size:12.5px;line-height:1.75;
  color:var(--ink2);background:rgba(232,185,85,.07);border:1px solid rgba(232,185,85,.25)}
.login-note ul{margin:0;padding-left:16px;list-style:none}
.login-note li{position:relative}
.login-note li::before{content:"・";position:absolute;left:-14px;color:var(--gold)}
.login-note b{color:var(--gold-soft);font-weight:800}
.login-note p{margin:8px 0 0;padding-top:8px;border-top:1px solid rgba(232,185,85,.18);color:var(--mut)}

/* 後台：LINE 綁定 */
.lrow{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid var(--line2)}
.lrow:last-child{border-bottom:0}
.lrow img{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--line2)}
.lrow .nm{flex:1;min-width:120px}
.lrow .nm b{display:block;color:#fff2cf;font-size:14px}
.lrow .nm span{font-size:11.5px;color:var(--mut)}
.lrow select{max-width:190px}
