/* ═══ 绿茵FC · v12「浮岛 Dock」全站外壳（006 补齐）═══
   主页 / 球员库 / 球员详情 / 阵容创建器 已在各自页内写死同一套变量，
   本文件把同一套语言给到其余页面（阵容广场 / 赛事中心 / 赛事详情 / 我的关注 /
   站长后台 / 本机抓取），避免六份页面各抄一遍导致再次走样。

   兼容说明：老页面的 CSS 大量引用 --bg2/--bg3/--bg4/--border2 这套旧变量名，
   这里把旧名字当别名映射到 v12 浮岛色，老规则一行不改也能直接吃到新配色，
   功能与结构零改动。页面自己的 <style> 排在本文件之后，可随时覆盖。 */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --sans:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:"SF Mono",Consolas,"Cascadia Code","JetBrains Mono",monospace;
  --r:20px; --r-s:12px; --r-xs:8px;
  font-size:14px;line-height:1.45;
}

/* ---- 夜：深海浮岛（默认） ---- */
:root,:root[data-v="e"]{
  --bg:#080D18; --bg-2:#0C1424;
  --glow1:radial-gradient(52vw 42vw at 12% -6%,rgba(56,225,176,.16),transparent 62%);
  --glow2:radial-gradient(46vw 38vw at 92% 8%,rgba(124,156,255,.15),transparent 60%);
  --glow3:radial-gradient(40vw 34vw at 60% 96%,rgba(255,138,76,.10),transparent 62%);
  --isle:rgba(18,26,42,.86); --isle-2:rgba(12,19,32,.9); --isle-hi:rgba(28,39,60,.92);
  --border:rgba(140,168,210,.16); --border2:rgba(140,168,210,.28);
  --border-hi:rgba(56,225,176,.42);
  --txt:#E9F0FA; --txt2:#AFC0D8; --txt3:#7286A3; --white:#FFFFFF;
  --cy:#38E1B0; --cy-dim:rgba(56,225,176,.13); --cy-line:rgba(56,225,176,.36);
  --ai:#7C9CFF; --ai-dim:rgba(124,156,255,.13); --ai-line:rgba(124,156,255,.36);
  --gold:#FFC85C; --track:rgba(140,168,210,.16);
  --green:#2FE08A; --lime:#8BE04B; --yellow:#FFC53D; --orange:#FF9142; --red:#FF5C7A;
  --sh-1:0 1px 2px rgba(0,0,0,.5);
  --sh-2:0 6px 18px -6px rgba(0,0,0,.62), 0 2px 5px rgba(0,0,0,.4);
  --sh-3:0 26px 54px -20px rgba(0,0,0,.78), 0 8px 20px -8px rgba(0,0,0,.5);
  --card-sh:drop-shadow(0 10px 18px rgba(0,0,0,.5));
  /* 旧变量别名：老页面的 CSS 不用改就能吃到浮岛色 */
  --bg2:rgba(18,26,42,.86); --bg3:rgba(28,39,60,.92); --bg4:rgba(12,19,32,.9);
  --scrim:rgba(4,8,16,.62);
}

/* ---- 日：暖纸浮岛（禁纯白） ---- */
:root[data-v="b"]{
  --bg:#EFEADD; --bg-2:#E7E0CF;
  --glow1:radial-gradient(52vw 42vw at 12% -6%,rgba(14,143,110,.16),transparent 62%);
  --glow2:radial-gradient(46vw 38vw at 92% 8%,rgba(61,90,201,.13),transparent 60%);
  --glow3:radial-gradient(40vw 34vw at 60% 96%,rgba(196,120,44,.14),transparent 62%);
  --isle:#F6F1E3; --isle-2:#EDE6D5; --isle-hi:#FBF6EA;
  --border:rgba(20,17,11,.13); --border2:rgba(20,17,11,.22);
  --border-hi:rgba(14,143,110,.45);
  --txt:#14110B; --txt2:#4A4438; --txt3:#7C7565; --white:#0B0906;
  --cy:#0E8F6E; --cy-dim:rgba(14,143,110,.12); --cy-line:rgba(14,143,110,.32);
  --ai:#3D5AC9; --ai-dim:rgba(61,90,201,.11); --ai-line:rgba(61,90,201,.3);
  --gold:#A9741A; --track:rgba(20,17,11,.12);
  --green:#0F7A4E; --lime:#4C7A15; --yellow:#9A6A05; --orange:#A94E12; --red:#B3243E;
  --sh-1:0 1px 2px rgba(60,48,26,.14);
  --sh-2:0 8px 20px -8px rgba(60,48,26,.24), 0 2px 5px rgba(60,48,26,.12);
  --sh-3:0 28px 56px -22px rgba(60,48,26,.34), 0 8px 18px -8px rgba(60,48,26,.18);
  --card-sh:drop-shadow(0 8px 16px rgba(60,48,26,.3));
  --bg2:#F6F1E3; --bg3:#FBF6EA; --bg4:#EDE6D5;
  --scrim:rgba(40,33,18,.42);
}

body{font-family:var(--sans);color:var(--txt);background:var(--bg);
  -webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
/* ⚠ z-index 必须是 -1，不能写 0。
   #sky/#grain 是 position:fixed 的「已定位元素」，而页面正文里有一批是普通静态块
   （站长后台的权限提示卡、阵容广场的"已删除"卡都直接挂在 body 下）。按 CSS 绘制顺序，
   z-index:0 的已定位元素会盖在静态块之上——页面元素明明渲染了、尺寸也对，就是看不见。
   （006 实测：admin.html 的 #gate 量到 460×190 在 y=110，截图上却是一片空白。）
   -1 让背景层退到正文之下，同时仍在 body 背景之上，两边都不牺牲。 */
#sky{position:fixed;inset:-12% -6%;z-index:-1;pointer-events:none;
  background:var(--glow1),var(--glow2),var(--glow3),linear-gradient(180deg,var(--bg),var(--bg-2))}
#grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.022) 0 1px,transparent 1px 3px)}
:root[data-v="b"] #grain{background:repeating-linear-gradient(180deg,rgba(60,48,26,.03) 0 1px,transparent 1px 3px)}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.mono{font-family:var(--mono)}

/* ══ 顶部浮岛（品牌 + 导航 + 右侧操作）══
   .nav-links 保持原样，site_chrome.js 会把它整块搬进底部 Dock；
   脚本没跑起来时留在顶部也照样可点。 */
.topfloat{position:fixed;top:12px;left:0;right:0;z-index:70;display:flex;justify-content:center;pointer-events:none}
.topfloat .inner{width:min(1236px,calc(100% - 24px));display:flex;align-items:center;gap:10px;pointer-events:auto}
.topfloat .spacer{flex:1;min-width:0}
.pill{background:var(--isle);border:1px solid var(--border);border-radius:99px;
  box-shadow:var(--sh-2);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3)}
.brand{display:flex;align-items:center;gap:9px;padding:8px 16px 8px 13px;text-decoration:none;color:var(--txt);flex-shrink:0}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--cy);box-shadow:0 0 0 4px var(--cy-dim),0 0 14px var(--cy);flex-shrink:0}
.brand .zh{font-size:15px;font-weight:800;letter-spacing:.4px;color:var(--txt);display:block}
.brand .tag{font:700 9.5px var(--mono);color:var(--txt3);letter-spacing:1.1px;display:block;margin-top:-2px}
.topact{display:flex;align-items:center;gap:8px;flex-shrink:0}
.btn-sm{font:700 12.5px var(--sans);padding:8px 14px;background:var(--isle);border:1px solid var(--border);
  border-radius:99px;color:var(--txt2);cursor:pointer;box-shadow:var(--sh-1);white-space:nowrap;text-decoration:none;
  display:inline-flex;align-items:center;gap:5px}
.btn-sm:hover{color:var(--txt);border-color:var(--border-hi)}
.btn-sm.primary{background:var(--cy-dim);border-color:var(--cy-line);color:var(--cy)}
#themeBtn{border:1.5px solid var(--border-hi);background:var(--cy-dim);color:var(--cy);font-weight:800}
#themeBtn:hover{background:var(--cy);color:var(--bg)}
.user-chip{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--txt2)}
.user-chip b{color:var(--cy)}
.nav-links{display:flex;gap:4px;align-items:center}
.nav-link{display:flex;align-items:center;gap:5px;padding:8px 12px;font-size:12.5px;font-weight:700;
  color:var(--txt2);text-decoration:none;border-radius:99px;border-bottom:0}
.nav-link:hover{color:var(--txt);background:var(--cy-dim)}
.nav-link.active{color:var(--cy)}

/* ══ 面包屑：顶部浮岛之下，跟着内容走 ══ */
.bread{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:66px 22px 0;
  font-size:12px;color:var(--txt3);display:flex;gap:5px;align-items:center;border-bottom:0}
.bread a{color:var(--txt3);text-decoration:none}
.bread a:hover{color:var(--cy)}
.bread .cur{color:var(--txt2)}
.bread+.wrap{padding-top:8px}

/* ══ 内容容器与浮岛卡 ══ */
.wrap{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:66px 22px 24px}
.panel{background:var(--isle);border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--sh-2);position:relative;min-width:0;
  transition:transform .26s cubic-bezier(.2,.9,.25,1),box-shadow .26s}
.panel:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.demo-tag{font-family:var(--mono);font-size:9px;color:var(--gold);
  border:1px solid var(--border);background:var(--isle-2);border-radius:99px;
  padding:2px 7px;letter-spacing:.06em;white-space:nowrap}

/* ══ 全站弹窗：浮岛玻璃卡 ══ */
.isle-modal{background:var(--isle);border:1px solid var(--border2);border-radius:var(--r);
  box-shadow:var(--sh-3);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3)}

@media (max-width:900px){
  html,body{overflow-x:clip}
  .topfloat{top:8px}
  .topfloat .inner{width:calc(100% - 16px);gap:7px}
  .brand{padding:7px 12px 7px 11px}
  .brand .zh{font-size:14px;white-space:nowrap}
  .brand .tag{display:none}
  .topact{gap:6px}
  .btn-sm{padding:7px 11px;font-size:12px}
  .wrap{padding:62px 10px 20px}
  .bread{padding:60px 12px 0}
  .bread+.wrap{padding-top:6px}
}
@media (prefers-reduced-motion:reduce){
  .panel,.panel:hover{transition:none;transform:none}
}