.tutorial-page { width:100%; max-width:960px; min-width:0; margin:0 auto; color:var(--tt-text); }
.tutorial-heading { display:flex; align-items:center; gap:10px; min-height:64px; margin-bottom:12px; }
.tutorial-heading h1,.tutorial-heading > span { margin:0; font-size:24px; font-weight:700; }
.tutorial-back { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; width:44px; height:44px; border:1px solid var(--tt-border); border-radius:12px; color:var(--tt-text-2); }
.tutorial-categories { display:flex; gap:8px; padding:0 0 16px; overflow-x:auto; scrollbar-width:none; }
.tutorial-categories::-webkit-scrollbar { display:none; }
.tutorial-categories a { flex:none; padding:10px 16px; border:1px solid var(--tt-border); border-radius:12px; color:var(--tt-text-2); white-space:nowrap; }
.tutorial-categories a[aria-current="page"] { border-color:var(--tt-text); background:var(--tt-text); color:var(--tt-bg); }
.tutorial-page a:focus-visible { outline:2px solid var(--tt-primary); outline-offset:3px; }
.tutorial-category-intro { padding:12px 0; border-bottom:1px solid var(--tt-border); }
.tutorial-category-intro h2 { margin:0 0 6px; font-size:18px; }
.tutorial-category-intro > div { color:var(--tt-text-2); line-height:1.7; overflow-wrap:anywhere; }
.tutorial-card { display:flex; gap:24px; align-items:center; padding:24px 0; border-bottom:1px solid var(--tt-border); }
.tutorial-card__body { flex:1; min-width:0; }
.tutorial-card h2 { margin:0 0 10px; font-size:19px; line-height:1.5; overflow-wrap:anywhere; }
.tutorial-card h2 a { color:var(--tt-text); }
.tutorial-card h2 a:hover { color:var(--tt-primary); }
.tutorial-card__excerpt { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:0 0 12px; color:var(--tt-text-2); font-size:14px; line-height:1.8; overflow-wrap:anywhere; }
.tutorial-meta { display:flex; flex-wrap:wrap; gap:6px 16px; color:var(--tt-text-3); font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.tutorial-meta a { color:var(--tt-text-2); }
.tutorial-card__image { flex:0 0 150px; width:150px; }
.tutorial-card__image img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; border-radius:12px; }
.tutorial-empty { padding:24px 0; color:var(--tt-text-2); }
.tutorial-article { padding:16px 0 0; }
.tutorial-article__header h1 { margin:0 0 16px; font-size:30px; line-height:1.5; overflow-wrap:anywhere; }
.tutorial-article__header { padding-bottom:24px; border-bottom:1px solid var(--tt-border); }
.tutorial-content { padding:24px 0; font-size:16px; line-height:1.9; overflow-wrap:anywhere; }
.tutorial-content p { margin:0 0 1.2em; }
.tutorial-content :is(h2,h3,h4) { margin:1.5em 0 .7em; line-height:1.5; scroll-margin-top:140px; }
.tutorial-content :is(ul,ol) { padding-left:1.6em; margin:1em 0; }
.tutorial-content ul { list-style:disc; }
.tutorial-content ol { list-style:decimal; }
.tutorial-content :is(img,video,iframe,figure,.wp-caption) { max-width:100%; }
.tutorial-content :is(img,video) { height:auto; }
.tutorial-content iframe { width:100%; height:auto; aspect-ratio:16/9; }
.tutorial-content :is(figure,.alignwide,.alignfull) { margin-left:0; margin-right:0; }
.tutorial-content :is(pre,table,.wp-block-table) { display:block; max-width:100%; overflow-x:auto; }
.tutorial-content pre { padding:16px; background:var(--tt-bg-card); border:1px solid var(--tt-border); border-radius:10px; }
.tutorial-content table { border-collapse:collapse; }
.tutorial-content :is(th,td) { padding:10px; border:1px solid var(--tt-border); }
.tutorial-content blockquote { margin:18px 0; padding:8px 18px; border-left:3px solid var(--tt-primary); color:var(--tt-text-2); }
.tutorial-content a,.tutorial-article__footer a,.tutorial-comments a { color:var(--tt-primary); }
.tutorial-article__footer { padding:20px 0; border-top:1px solid var(--tt-border); }
.tutorial-page :is(.nav-links,.tutorial-pages) { display:flex; flex-wrap:wrap; gap:8px; padding:24px 0; }
.tutorial-page .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:40px; min-height:40px; padding:6px 12px; border:1px solid var(--tt-border); border-radius:10px; }
.tutorial-page .page-numbers.current { color:var(--tt-primary); border-color:var(--tt-primary); }
.tutorial-comments { margin-top:28px; padding-top:24px; border-top:1px solid var(--tt-border); }
.tutorial-comments h2,.tutorial-comments .comment-reply-title { font-size:20px; }
.tutorial-comment-list { padding:0; list-style:none; }
.tutorial-comment-list .children { margin-left:18px; padding:0; list-style:none; }
.tutorial-comment-list .comment-body { padding:18px 0; border-bottom:1px solid var(--tt-border); overflow-wrap:anywhere; }
.tutorial-comment-list .avatar { width:36px; height:36px; margin-right:8px; border-radius:50%; vertical-align:middle; }
.tutorial-comment-list .comment-meta { margin:8px 0; font-size:12px; }
.tutorial-comment-list .comment-meta a { color:var(--tt-text-3); }
.tutorial-comment-list img { max-width:100%; height:auto; }
.tutorial-comments :is(input:not([type=checkbox]):not([type=submit]):not([type=hidden]),textarea),.tutorial-content input[type=password] { box-sizing:border-box; width:100%; max-width:100%; padding:12px; border:1px solid var(--tt-border); border-radius:10px; background:var(--tt-bg-card); color:var(--tt-text); }
.tutorial-comments textarea { min-height:120px; resize:vertical; }
.tutorial-comments label { display:inline-block; margin:8px 0; }
.tutorial-comments input[type=submit],.tutorial-content input[type=submit] { padding:10px 20px; border:0; border-radius:12px; background:var(--tt-primary); color:#fff; cursor:pointer; }
.tutorial-comments .comment-form-cookies-consent { display:flex; gap:8px; align-items:center; }
.tutorial-comments .comment-notes { font-size:13px; color:var(--tt-text-2); }
@media (max-width:767px) {
	body.tapdown-tutorial-document { --tt-topbar-h:calc(56px + env(safe-area-inset-top)); }
	.tapdown-tutorial-document .tapdown-topbar__inner { grid-template-rows:56px; height:56px; min-height:56px; padding-bottom:0; }
	.tapdown-tutorial-document .tapdown-topbar__center { display:none; }
	body.tapdown-tutorial-document:not(.nav-locked):not(:has(dialog[open])) { overflow-x:clip; }
	.tutorial-heading { min-height:var(--tt-mobile-sticky-h); height:var(--tt-mobile-sticky-h); margin:0 -12px 12px; padding:0 12px; }
	.tutorial-heading h1,.tutorial-heading > span { font-size:var(--tt-mobile-sticky-font); }
	.tutorial-back { flex-basis:var(--tt-mobile-sticky-control); width:var(--tt-mobile-sticky-control); height:var(--tt-mobile-sticky-control); }
	.tutorial-card { gap:12px; padding:20px 0; }
	.tutorial-card h2 { font-size:17px; margin-bottom:8px; }
	.tutorial-card__image { flex-basis:96px; width:96px; }
	.tutorial-meta { gap:4px 10px; }
	.tutorial-article__header h1 { font-size:24px; }
	.tutorial-content { padding:20px 0; }
}