/* Shared Quietfield typography and color tokens; local reading layout. */
*{box-sizing:border-box}
html,body{margin:0;overflow-x:clip;background:var(--color-canvas);color:var(--color-ink)}
body{font:var(--type-body-md);letter-spacing:var(--tracking-body-md);word-break:keep-all;overflow-wrap:break-word;text-wrap:pretty}
a{color:var(--color-accent);text-underline-offset:3px;touch-action:manipulation}
.guide-skip{position:absolute;top:0;left:var(--space-md);transform:translateY(-100%);padding:var(--space-sm);background:var(--color-canvas)}
.guide-skip:focus{transform:none}
a:hover{color:var(--color-accent-hover)}
a:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}
.guide-shell{width:min(calc(100% - 32px),720px);margin-inline:auto}
.guide-top{border-bottom:1px solid var(--color-line)}
.guide-top nav{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:var(--space-lg)}
.guide-top a,.guide-next a,.guide-footer a{display:inline-flex;align-items:center;min-height:44px}
.guide-brand{color:var(--color-ink);font-weight:600;text-decoration:none}
.guide-hero{padding-block:var(--space-2xl) var(--space-xl);border-bottom:1px solid var(--color-line)}
h1{margin:0;font:var(--type-h1);letter-spacing:var(--tracking-h1);text-wrap:balance}
.guide-hero p{margin:var(--space-lg) 0 0;color:var(--color-ink-soft);font:var(--type-body-lg)}
.guide-body{padding-block:var(--space-xs) var(--space-xl)}
h2{margin:var(--space-xl) 0 var(--space-md);font:var(--type-h2);letter-spacing:var(--tracking-h2);text-wrap:balance}
.guide-body p,.guide-body ul{margin:var(--space-md) 0;color:var(--color-ink-soft)}
.guide-body li+li{margin-top:var(--space-xs)}
.guide-body ul{padding-left:var(--space-lg)}
.guide-next,.guide-footer{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-lg);border-top:1px solid var(--color-line);padding-block:var(--space-lg)}
@media(max-width:620px){.guide-hero{padding-top:var(--space-xl)}.guide-next{flex-direction:column;align-items:flex-start}}