.tutorial-site { margin:0; color:#24384a; background:#f5f7fa; font:16px/1.75 "Microsoft YaHei", "PingFang SC", sans-serif; }
.tutorial-site * { box-sizing:border-box; }
.tutorial-site [hidden] { display:none !important; }
.tutorial-site a { color:#215f98; text-decoration:none; }
.tutorial-site a:hover { text-decoration:underline; }
.tutorial-site a:focus-visible, .tutorial-site input:focus-visible { outline:3px solid #e69a22; outline-offset:4px; }
.tutorial-shell { width:calc(100% - 40px); max-width:1120px; margin:auto; }
.tutorial-header { background:#fff; border-bottom:1px solid #dce4ec; }
.tutorial-header-inner { min-height:82px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.tutorial-brand { font-size:24px; font-weight:700; color:#24384a !important; white-space:nowrap; }
.tutorial-brand span { color:#2679b5; margin-left:6px; }
.tutorial-header nav { display:flex; gap:26px; flex-wrap:wrap; }
.tutorial-header [aria-current] { border-bottom:2px solid #2679b5; }
.tutorial-intro { padding:48px 0 26px; max-width:850px; }
.tutorial-eyebrow { color:#226da4; margin:0 0 8px; font-weight:700; letter-spacing:2px; }
.tutorial-site h1 { font-size:36px; line-height:1.4; margin:0 0 18px; letter-spacing:-.5px; }
.tutorial-site h2 { font-size:23px; margin:0 0 18px; line-height:1.5; }
.tutorial-intro p { margin-top:10px; }
.tutorial-meta { color:#5b6d7c; font-size:14px; }
.tutorial-search-box { background:#fff; border:1px solid #dce4ec; padding:24px; border-radius:8px; }
.tutorial-search-box label { display:block; font-weight:700; margin-bottom:8px; }
.tutorial-search-box input { display:block; width:100%; border:1px solid #8a9dae; background:#fff; padding:12px 14px; font:inherit; border-radius:4px; color:inherit; }
.tutorial-search-box p { margin:8px 0 0; color:#5b6d7c; font-size:14px; }
.tutorial-categories { display:flex; flex-wrap:wrap; gap:12px 24px; margin:24px 0 36px; }
.tutorial-categories a { padding:6px 0; }
.tutorial-categories span { color:#5b6d7c; font-size:13px; margin-left:4px; }
.tutorial-group { margin:0 0 42px; scroll-margin-top:20px; }
.tutorial-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; list-style:none; padding:0; margin:0; }
.tutorial-card { border:1px solid #dce4ec; background:#fff; border-radius:6px; overflow-wrap:anywhere; }
.tutorial-card a { display:block; padding:22px; height:100%; color:#24384a; }
.tutorial-card a:hover { text-decoration:none; background:#f0f6fc; }
.tutorial-card h3 { font-size:18px; line-height:1.5; margin:0 0 10px; }
.tutorial-card p { font-size:14px; color:#536675; margin:0 0 14px; }
.tutorial-card-link { font-size:14px; color:#215f98; }
.tutorial-panel, .tutorial-note { background:#fff; border:1px solid #dce4ec; padding:28px; border-radius:6px; margin:0 0 24px; }
.tutorial-note { border-left:4px solid #2679b5; }
.tutorial-note ul { padding-left:22px; }
.tutorial-note li, .tutorial-steps li { margin:12px 0; }
.tutorial-steps { padding-left:28px; }
.tutorial-domains { color:#536675; overflow-wrap:anywhere; }
.tutorial-button { display:inline-block; padding:10px 20px; background:#236ba3; color:#fff !important; border-radius:4px; margin-top:12px; }
.tutorial-breadcrumb { margin-top:26px; font-size:14px; }
.tutorial-breadcrumb + article .tutorial-intro { padding-top:28px; }
.tutorial-related { margin:36px 0; }
.tutorial-related ul { display:flex; flex-wrap:wrap; gap:10px 26px; padding:0; list-style:none; }
.tutorial-empty { padding:28px; background:#fff; border:1px solid #dce4ec; }
.tutorial-footer { padding:30px 0; border-top:1px solid #dce4ec; color:#5b6d7c; font-size:14px; }
.tutorial-footer p { margin:4px 0; }
@media (max-width:850px) { .tutorial-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) {
  .tutorial-header-inner { padding:16px 0; align-items:flex-start; flex-direction:column; gap:12px; }
  .tutorial-header nav { gap:20px; font-size:14px; }
  .tutorial-intro { padding-top:32px; }
  .tutorial-site h1 { font-size:28px; }
  .tutorial-grid { grid-template-columns:1fr; }
  .tutorial-search-box, .tutorial-panel, .tutorial-note { padding:20px; }
  .tutorial-search-box input { font-size:16px; }
}
