/* ============================================================
   TechSchool Skin v1 · techschool.top
   注入式皮肤：不动 13,862 页 HTML，只覆写 RUNOOB 主题样式
   目标 DOM：.logo-search / .pc-nav / .left-column(#leftcolumn)
             .article-body / .example_code / .previous-next-links
             #wiki-lang-switch
   暗色：兼容 html[data-theme="dark"] 与 body.dark
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* ---------- tokens（命名空间 ts- 防冲突） ---------- */
:root{
  --ts-accent:#635BFF;
  --ts-accent-ink:#0A2540;
  --ts-ink:#172B4D;
  --ts-ink-2:#425466;
  --ts-ink-3:#697386;
  --ts-line:#E3E8EE;
  --ts-paper:#FFFFFF;
  --ts-paper-2:#F6F9FC;
  --ts-surface:#FFFFFF;
  --ts-code-shell:#0A2540;
  --ts-code-ink:#E6EBF1;
  --ts-nav-bg:rgba(255,255,255,.96);
  --ts-font-sans:'Inter',-apple-system,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  --ts-font-mono:'IBM Plex Mono','SF Mono',Menlo,Consolas,monospace;
}
html[data-theme="dark"], body.dark{
  --ts-accent:#8A84FF;
  --ts-accent-ink:#E2E8F3;
  --ts-ink:#E2E8F3;
  --ts-ink-2:#A9B6CC;
  --ts-ink-3:#71809C;
  --ts-line:#24304A;
  --ts-paper:#0C1322;
  --ts-paper-2:#111B30;
  --ts-surface:#0F1930;
  --ts-code-shell:#0A1020;
  --ts-nav-bg:rgba(12,19,34,.96);
}

/* ---------- 全局字型 ---------- */
body{
  font-family:var(--ts-font-sans) !important;
  color:var(--ts-ink);
  background:var(--ts-paper);
}
a{transition:color .12s ease}

/* ---------- 顶部：品牌条 + 搜索（.logo-search） ---------- */
.container.logo-search{
  background:var(--ts-nav-bg) !important;
  border-bottom:1px solid var(--ts-line) !important;
}
.container.logo-search::before{ /* 由 inject.js 插入 wordmark；此规则兜底隐藏原站空壳 */
  content:none;
}
.ts-wordmark{
  font-weight:800;font-size:17px;letter-spacing:.02em;
  color:var(--ts-accent-ink) !important;text-decoration:none !important;
  white-space:nowrap;display:inline-flex;align-items:center;
}
.ts-wordmark em{font-style:normal;color:var(--ts-accent)}
.ts-wordmark:hover em{opacity:.85}
.logo-search .search-input input#s,
.logo-search input.placeholder{
  font-family:var(--ts-font-sans) !important;
  font-size:14px !important;
  background:var(--ts-paper-2) !important;
  border:1px solid var(--ts-line) !important;
  border-radius:6px !important;
  color:var(--ts-ink) !important;
}
.logo-search .search-input input#s:focus{border-color:var(--ts-accent) !important;outline:0}

/* ---------- 主分类导航（.pc-nav） ---------- */
nav.container.navigation{
  background:var(--ts-nav-bg) !important;
  border-bottom:1px solid var(--ts-line) !important;
}
.pc-nav{display:flex;align-items:center;gap:2px}
.pc-nav a{
  font-family:var(--ts-font-sans) !important;
  font-size:14px;font-weight:500;
  color:var(--ts-ink-2) !important;
  padding:10px 10px !important;
  border-bottom:2px solid transparent;
  text-decoration:none !important;
}
.pc-nav a:hover{color:var(--ts-accent-ink) !important}
.pc-nav a.active{
  color:var(--ts-accent-ink) !important;
  border-bottom-color:var(--ts-accent) !important;
}
.pc-nav li.nav-theme-toggle button{
  border:1px solid var(--ts-line) !important;
  background:var(--ts-surface) !important;
  color:var(--ts-ink-2) !important;
  border-radius:99px !important;
}
.pc-nav li.nav-theme-toggle button:hover{border-color:var(--ts-accent) !important;color:var(--ts-accent) !important}

/* ---------- 语言切换器（#wiki-lang-switch） ---------- */
#wiki-lang-switch{
  font-family:var(--ts-font-sans) !important;
  background:var(--ts-surface) !important;
  border:1px solid var(--ts-line) !important;
  border-radius:99px !important;
  box-shadow:0 1px 6px rgba(10,37,64,.10) !important;
  padding:3px !important;
}
#wiki-lang-switch a{
  color:var(--ts-ink-3) !important;border-radius:99px !important;font-size:12px;
}
#wiki-lang-switch a:hover{background:var(--ts-paper-2) !important;color:var(--ts-ink) !important}
#wiki-lang-switch a.on{background:var(--ts-accent) !important;color:#fff !important}

/* ---------- 左侧目录（#leftcolumn） ---------- */
.left-column .tab{
  font-family:var(--ts-font-sans) !important;
  font-weight:700;font-size:14px;color:var(--ts-accent-ink) !important;
  background:transparent !important;border:0 !important;
  padding:4px 0 12px !important;
}
.design#leftcolumn{background:transparent !important}
.design#leftcolumn a{
  font-family:var(--ts-font-sans) !important;
  font-size:13.5px !important;line-height:1.5;
  color:var(--ts-ink-2) !important;
  border-left:2px solid transparent !important;
  border-radius:0 6px 6px 0;
  padding:6px 12px !important;margin-left:-8px;
  text-decoration:none !important;
}
.design#leftcolumn a:hover{
  background:var(--ts-paper-2) !important;color:var(--ts-accent) !important;
}
.design#leftcolumn a[data-p="par"]{
  font-weight:600;color:var(--ts-ink) !important;
}
.design#leftcolumn a.current,
.design#leftcolumn a[href$="python3-tutorial.html"].current{
  color:var(--ts-accent) !important;font-weight:600;
  border-left-color:var(--ts-accent) !important;
  background:var(--ts-paper-2) !important;
}

/* ---------- 正文（.article-body） ---------- */
.article-body{
  font-size:15px;line-height:1.75;color:var(--ts-ink);
}
.article-body h1{
  font-family:var(--ts-font-sans) !important;
  font-size:30px;font-weight:800;letter-spacing:-.02em;
  color:var(--ts-accent-ink) !important;line-height:1.25;
  margin:8px 0 20px !important;
}
.article-body h2,.article-body h3,.left_h2{
  font-family:var(--ts-font-sans) !important;
  font-size:21px;font-weight:700;letter-spacing:-.01em;
  color:var(--ts-accent-ink) !important;
  margin:40px 0 14px !important;padding-bottom:8px;
  border-bottom:1px solid var(--ts-line) !important;
}
.article-body h3{font-size:17px;border-bottom:0 !important;margin:28px 0 10px !important}
.article-body p{color:var(--ts-ink);text-wrap:pretty}
.article-body a{color:var(--ts-accent) !important;text-decoration:none !important;
  border-bottom:1px solid rgba(99,91,255,.35)}
.article-body a:hover{border-bottom-color:var(--ts-accent)}
.article-body strong{color:var(--ts-accent-ink)}
.article-body hr{border:0;border-top:1px solid var(--ts-line);margin:36px 0}
.article-body img{max-width:100%;height:auto;border-radius:6px}

/* ---------- 代码块（pre / .example_code）→ 深海军蓝窗体 ---------- */
.article-body pre,
.example,
.example_code{
  background:var(--ts-code-shell) !important;
  color:var(--ts-code-ink) !important;
  font-family:var(--ts-font-mono) !important;
  font-size:13.5px;line-height:1.6;
  border:0 !important;border-radius:8px !important;
  padding:16px 18px !important;
  overflow-x:auto;
  box-shadow:0 8px 24px -8px rgba(10,37,64,.35);
}
.example{padding:0 !important;overflow:hidden}
.example h2.example{
  background:rgba(255,255,255,.06) !important;
  color:#ADBDCC !important;
  font-size:12px !important;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 18px !important;margin:0 !important;border-bottom:1px solid rgba(255,255,255,.08) !important;
}
.example .example_code{border-radius:0 !important;box-shadow:none !important}
.example_code span{color:inherit}

/* ---------- Prev / Next ---------- */
.previous-next-links a,
.next-design-link a{
  font-family:var(--ts-font-sans) !important;
  display:inline-block;
  border:1px solid var(--ts-line) !important;border-radius:6px !important;
  background:var(--ts-surface) !important;
  color:var(--ts-ink) !important;
  padding:10px 16px !important;font-size:14px;font-weight:600;
  text-decoration:none !important;
  transition:border-color .14s,box-shadow .14s;
}
.previous-next-links a:hover,
.next-design-link a:hover{
  border-color:#C6C2FF !important;color:var(--ts-accent) !important;
  box-shadow:0 4px 16px -4px rgba(10,37,64,.1);
}

/* ---------- 侧栏推荐位降噪 ---------- */
.sidebar-box.re-box{background:var(--ts-paper-2) !important;border:1px solid var(--ts-line) !important;border-radius:8px !important}

/* ---------- 暗色下语法高亮微调 ---------- */
html[data-theme="dark"] .article-body pre,
body.dark .article-body pre,
html[data-theme="dark"] .example_code,
body.dark .example_code{box-shadow:0 8px 24px -8px rgba(0,0,0,.6)}

/* ---------- 响应式 ---------- */
@media (max-width:768px){
  .article-body h1{font-size:24px}
  .article-body h2,.article-body h3,.left_h2{font-size:18px}
  .pc-nav{flex-wrap:wrap}
  #wiki-lang-switch{top:auto !important;bottom:14px !important}
}