/* Typo Token Language: guides index and guide articles */
.tk-ggroup{margin:30px 0 42px}
.tk-ggroup header{margin-bottom:16px}.tk-ggroup h2{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.04em;margin:0 0 4px}.tk-ggroup header p{margin:0;color:var(--muted)}
.tk-lab-band{display:flex;justify-content:space-between;align-items:center;gap:24px;border-radius:28px;padding:30px 34px;margin:20px 0 10px;background:linear-gradient(125deg,rgba(255,244,236,.92),rgba(232,247,241,.92))}
.tk-lab-band h2{font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.04em;margin:4px 0 6px}.tk-lab-band p{margin:0;color:var(--muted)}
.tk-art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start;padding:44px 0 10px}
.tk-article{max-width:760px;min-width:0}
.tk-art-head h1{font-size:clamp(2.2rem,4.4vw,3.7rem);letter-spacing:-.055em;line-height:1.07;font-weight:760;margin:18px 0 12px}
.tk-art-meta{color:#7c7065;font-size:13px;margin:0}
.tk-quick{border-radius:22px;padding:20px 24px;background:linear-gradient(120deg,#fff3ea,#edf8f3);border:1px solid #f4e2d5;margin:24px 0 8px}
.tk-quick h2{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#a0582a;font-weight:800;margin:0 0 6px}
.tk-quick p{margin:0;font-size:17px;line-height:1.65;color:#31281e}
.tk-art-body{overflow-wrap:break-word}
.tk-art-body h2{font-size:clamp(1.35rem,2.2vw,1.75rem);letter-spacing:-.03em;line-height:1.22;margin:40px 0 10px}
.tk-art-body p,.tk-art-body li{font-size:16.5px;line-height:1.72;color:#43382d}
.tk-art-body p{margin:0 0 14px}
.tk-art-body ul,.tk-art-body ol{padding-left:22px;margin:0 0 16px}.tk-art-body li{margin:6px 0}
.tk-art-body a,.tk-sources a{color:#8f3b00;font-weight:620}
.tk-art-body code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;background:#fdf0e6;color:#7a3a10;padding:1px 6px;border-radius:6px;overflow-wrap:anywhere}
.tk-note{border-left:3px solid #db742f;background:#fff7f0;padding:12px 16px;border-radius:0 14px 14px 0;font-size:15px!important}
.tk-gex{margin:26px 0;border-radius:22px;padding:18px 18px 16px}
.tk-gex figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;font-size:13px;margin-bottom:10px;color:#5d554c}.tk-gex figcaption b{color:#31281e}
.tk-gex .tk-ex>div{font-size:14px;overflow-wrap:anywhere;white-space:pre-wrap}
.tk-gex .tk-src{display:inline-block;margin-top:12px}
.tk-gex-none{font-size:13px;color:#7c7065;margin:10px 0 0}
.tk-sources{margin-top:44px;border-top:1px solid var(--line);padding-top:22px}
.tk-sources h2{font-size:18px;letter-spacing:-.02em;margin:0 0 10px}.tk-sources ul{margin:0 0 10px;padding-left:20px;display:grid;gap:6px;font-size:15px}
.tk-art-side{position:sticky;top:84px;display:grid;gap:16px;min-width:0}
.tk-side-card{border-radius:24px;padding:22px}.tk-side-card h2{font-size:18px;letter-spacing:-.025em;margin:0 0 6px}.tk-side-card p{margin:0 0 14px;color:var(--muted);font-size:14px}.tk-side-card .btn{width:100%}
.tk-toc{padding:4px 6px}.tk-toc h2{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#8c8074;margin:0 0 8px}
.tk-toc ol{margin:0;padding-left:18px;display:grid;gap:6px;font-size:13.5px}.tk-toc a{color:#5e4e3f;text-decoration:none}.tk-toc a:hover{color:#8f3b00;text-decoration:underline}
.tk-related{padding:34px 0 0}.tk-related h2{font-size:clamp(1.4rem,2.2vw,1.8rem);letter-spacing:-.035em;margin:0 0 16px}
@media(max-width:980px){.tk-art-wrap{grid-template-columns:1fr;gap:26px}.tk-art-side{position:static}.tk-toc{display:none}}
@media(max-width:780px){.tk-lab-band{flex-direction:column;align-items:flex-start;padding:24px}.tk-art-wrap{padding-top:30px}}
@media(max-width:560px){.tk-quick{padding:16px 18px}.tk-quick p{font-size:16px}.tk-art-body p,.tk-art-body li{font-size:16px}.tk-gex{padding:14px}}

/* mobile-overflow-guard */
/* Root cause of the sideways scrolling on phones (9 Nov 2026): grid and flex children default to min-width:auto, so one wide child
   (a demo window, a no-wrap row, a long word) made the whole column wider than the screen. Children of every grid may shrink. */
.tk-art-wrap>*,.tk-sources ul>*,.tk-art-side>*,.tk-toc ol>*{min-width:0}
