/* IronByte Materials — shared stylesheet */
:root{
  --bg:#0f1216; --card-bg:#161a20; --panel:#12151b; --text:#e9ecf1;
  --muted:#99a1ac; --dim:#5f6772; --border:#272d37; --accent:#6fa0c8;
  --font:'Helvetica Neue',Arial,'PingFang TC','Microsoft JhengHei',sans-serif;
  --mono:'Courier New',monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.6;}
a{text-decoration:none;color:inherit;}

nav.top{position:sticky;top:0;z-index:99;display:flex;justify-content:space-between;
  align-items:center;height:64px;padding:0 6%;background:rgba(15,18,22,0.97);
  border-bottom:1px solid var(--border);backdrop-filter:blur(10px);}
nav.top .logo{font-size:1.1rem;font-weight:900;letter-spacing:3px;text-transform:uppercase;}
nav.top .logo em{color:var(--accent);font-style:normal;}
nav.top .back{font-size:0.76rem;letter-spacing:1px;text-transform:uppercase;color:var(--muted);transition:color .2s;}
nav.top .back:hover{color:var(--accent);}

.breadcrumb{padding:14px 6%;font-size:0.74rem;color:var(--dim);border-bottom:1px solid var(--border);}
.breadcrumb a{color:#727b88;transition:color .2s;}
.breadcrumb a:hover{color:var(--accent);}
.breadcrumb span{margin:0 7px;}

.layout{display:flex;align-items:flex-start;max-width:1320px;margin:0 auto;}

/* sidebar */
.sidebar{width:280px;flex-shrink:0;border-right:1px solid var(--border);
  position:sticky;top:64px;height:calc(100vh - 64px);overflow-y:auto;padding:26px 0 50px;}
.sb-head{padding:0 24px 4px;font-size:0.66rem;letter-spacing:3px;text-transform:uppercase;color:var(--accent);}
.sb-sub{padding:0 24px 16px;font-size:0.74rem;color:var(--dim);}
.sb-search{margin:0 20px 14px;position:relative;}
.sb-search input{width:100%;padding:9px 12px 9px 32px;background:var(--card-bg);
  border:1px solid var(--border);color:var(--text);font-size:0.8rem;font-family:var(--font);outline:none;transition:border-color .2s;}
.sb-search input:focus{border-color:var(--accent);}
.sb-search::before{content:'\1F50D';position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:11px;opacity:.5;}
.sb-group{padding:13px 24px 6px;font-size:0.62rem;letter-spacing:2px;text-transform:uppercase;
  color:var(--accent);border-top:1px solid #1c212a;margin-top:5px;}
.sb-group:first-of-type{border-top:none;margin-top:0;}
.sb-item{display:block;padding:7px 24px;font-size:0.84rem;color:var(--muted);
  font-family:var(--mono);border-left:2px solid transparent;transition:all .15s;}
.sb-item:hover{color:var(--text);background:#1b2028;}
.sb-item.active{color:var(--accent);border-left-color:var(--accent);background:#1b2028;font-weight:700;}
.sb-empty{padding:16px 24px;font-size:0.78rem;color:var(--dim);display:none;}

/* content */
.content{flex:1;min-width:0;padding:40px 52px 100px;}
.ds-label{font-size:0.66rem;letter-spacing:3px;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:12px;}
.ds-title{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:900;letter-spacing:1px;}
.ds-title em{font-style:normal;color:var(--accent);}
.ds-sub{margin-top:8px;font-size:0.86rem;color:var(--muted);letter-spacing:.5px;}
.ds-bar{width:42px;height:2px;background:var(--accent);margin:20px 0 8px;}

.ds-sec{margin-top:40px;}
.ds-sec h2{display:flex;align-items:baseline;gap:12px;font-size:1.04rem;font-weight:800;
  text-transform:uppercase;letter-spacing:1px;padding-bottom:11px;border-bottom:1px solid var(--border);}
.sec-no{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:26px;height:26px;background:var(--accent);color:#000;font-family:var(--mono);
  font-size:0.82rem;font-weight:900;border-radius:3px;}
.ds-sec h2 small{font-size:0.72rem;font-weight:500;color:var(--dim);letter-spacing:.5px;text-transform:none;}
.ds-sec p.txt{margin-top:14px;font-size:0.88rem;color:var(--muted);line-height:1.8;}

table.spec{width:100%;border-collapse:collapse;margin-top:16px;font-size:0.85rem;}
table.spec caption{text-align:left;font-size:0.74rem;color:var(--dim);padding:0 0 8px;}
table.spec th{background:var(--panel);color:var(--accent);text-align:left;
  font-size:0.66rem;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;
  padding:10px 14px;border:1px solid var(--border);}
table.spec td{padding:10px 14px;border:1px solid var(--border);color:var(--text);vertical-align:top;}
table.spec td.k{color:var(--muted);}
table.spec td.v{font-family:var(--mono);white-space:nowrap;}
table.spec td.note{color:var(--dim);font-size:0.8rem;}
table.spec tr:nth-child(even) td{background:#13161c;}
table.spec tr:hover td{background:#1b2028;}
.elem-sym{font-family:var(--mono);font-weight:700;color:var(--accent);}

.ds-note{margin-top:42px;background:var(--panel);border:1px solid var(--border);
  border-left:2px solid var(--accent);border-radius:3px;padding:16px 20px;
  font-size:0.78rem;color:var(--muted);line-height:1.75;}
.ds-note strong{color:var(--accent);display:block;font-size:0.66rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px;}

/* series overview */
.ov-card{background:var(--card-bg);border:1px solid var(--border);border-radius:4px;padding:36px 40px;margin-top:8px;}
.ov-el{font-family:var(--mono);color:var(--accent);font-size:0.84rem;letter-spacing:1px;}
.ov-desc{margin-top:14px;font-size:0.92rem;color:var(--muted);line-height:1.85;}
.ov-stats{display:flex;flex-wrap:wrap;gap:1px;background:var(--border);border:1px solid var(--border);margin-top:28px;}
.ov-stat{background:var(--panel);padding:20px 26px;flex:1;min-width:130px;}
.ov-stat .n{font-size:1.7rem;font-weight:900;color:var(--accent);}
.ov-stat .l{font-size:0.72rem;color:var(--muted);margin-top:3px;}
.ov-hint{margin-top:26px;font-size:0.84rem;color:var(--dim);}
.ov-hint b{color:var(--accent);font-weight:700;}

footer{padding:34px 6%;background:#080a0e;border-top:1px solid var(--border);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
footer .logo{font-size:0.95rem;font-weight:900;letter-spacing:2px;text-transform:uppercase;}
footer .logo em{color:var(--accent);font-style:normal;}
footer small{font-size:0.74rem;color:var(--dim);}

@media(max-width:860px){
  .layout{flex-direction:column;}
  .sidebar{width:100%;position:static;height:auto;border-right:none;
    border-bottom:1px solid var(--border);max-height:340px;}
  .content{padding:32px 7% 80px;}
  table.spec{font-size:0.8rem;}
  table.spec td.v{white-space:normal;}
}

.pen{display:block;font-size:0.73rem;color:var(--dim);font-weight:400;margin-top:2px;}

/* i18n bilingual toggle */
html[data-lang="en"] .lang-zh { display: none !important; }
html[data-lang="zh"] .lang-en { display: none !important; }
.lang-switch { display: inline-flex; align-items: center; gap: 4px; font-size: 0.7rem; letter-spacing: 1px; }
.lang-switch a { color: var(--muted); padding: 4px 9px; border-radius: 3px; cursor: pointer; transition: color .15s, background .15s; }
.lang-switch a:hover { color: var(--accent); }
.lang-switch a.active { color: var(--accent); background: rgba(111,160,200,0.12); }
.lang-switch .sep { color: var(--border); user-select: none; opacity: 0.7; }
.lang-switch-nav { margin-left: auto; margin-right: 14px; }