.tutorial-body{min-height:100vh;background:linear-gradient(180deg,#edf5ff 0,#f8fafc 48%,#eef2f7 100%)}
.tutorial-topbar{position:sticky;top:0;z-index:20}.tutorial-main{width:min(1180px,calc(100% - 32px));margin:28px auto 50px}.tutorial-hero{display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:center;background:linear-gradient(120deg,#102033,#0f5ea8);color:#fff;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,94,168,.18)}.tutorial-hero h2{font-size:34px;margin:10px 0}.tutorial-hero p{color:#dbeafe;max-width:700px}.tutorial-kicker{display:inline-block;border:1px solid rgba(255,255,255,.35);padding:6px 10px;border-radius:99px;font-size:12px;font-weight:800;letter-spacing:.08em}.youtube-card{display:flex;align-items:center;gap:16px;background:#fff;color:#102033;border-radius:18px;padding:20px;text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.2)}.youtube-card small{display:block;color:#667085;margin-top:5px}.youtube-play{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#dc2626;color:#fff;font-size:24px;padding-left:3px}.tutorial-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0}.tutorial-steps article,.tutorial-panel,.tutorial-warning{background:#fff;border:1px solid #d9e1ec;border-radius:18px;padding:20px;box-shadow:0 8px 22px rgba(16,32,51,.06)}.tutorial-steps article>span{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#e8f2ff;color:#0f5ea8;font-weight:800}.tutorial-steps h3{font-size:16px;margin:14px 0 8px}.tutorial-steps p,.tutorial-panel small,.tutorial-panel p,.tutorial-warning p{color:#667085;line-height:1.55}.tutorial-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.tutorial-panel h2{margin-top:0}.tutorial-panel table{width:100%;border-collapse:collapse}.tutorial-panel th,.tutorial-panel td{padding:12px;border-bottom:1px solid #e5e7eb;text-align:left;vertical-align:top}.tutorial-panel th{color:#0f5ea8}.units-table th{background:#f8fafc}.tutorial-tip{margin-top:18px;padding:16px;border-radius:14px;background:#fff7ed;border:1px solid #fed7aa}.tutorial-tip p{margin:7px 0 12px}.tutorial-tip a{display:inline-block;padding:9px 12px;background:#dc2626;color:#fff;border-radius:9px;text-decoration:none;font-weight:700}.tutorial-warning{margin-top:18px;border-left:5px solid #b54708}.tutorial-warning h2{margin:0 0 8px;font-size:18px}@media(max-width:900px){.tutorial-hero,.tutorial-grid{grid-template-columns:1fr}.tutorial-steps{grid-template-columns:1fr 1fr}}@media(max-width:600px){.tutorial-main{width:min(100% - 20px,1180px)}.tutorial-hero{padding:24px}.tutorial-hero h2{font-size:26px}.tutorial-steps{grid-template-columns:1fr}}